以往拿到一份视觉稿要做页面适配，通常都是针对不同分辨率尺寸做断点写 media query，然后看效果再微调。开发过程中视觉稿要是做了修改，修改的地方就得再走一遍分辨率测试和微调，这时想屎的心都有了。而且这些适配都是建立在已 知的分辨率尺寸库上，如果市面新出来一款分辨率尺寸机型，呵呵，又要奔跑在测试微调路上。是不是能有用一套代码就适应各种分辨率窗口，那么就不会再有上面 这些烦恼，且开发效率快和维护成本会降低很多。

由于网页的执行都是单线程的，在JS执行的过程中，页面会呈现阻塞状态。因此，如果JS处理的数据量过大，过程复杂，可能会造成页面的卡顿。传统的数据展现都以分页的形式，但是分页的效果并不好，需要用户手动点击下一页，才能看到更多的内容。

有很多网站使用 无限分页 的模式，即网页视窗到达内容底部就自动加载下一部分的内容。。。

本篇就无限分页的实现模型，讲述其中奥妙。

在讲贪婪模式和惰性模式之前，先回顾一下JS正则基础：

写法基础

①不需要双引号，直接用//包含 => /wehfwue123123/.test();

②反斜杠\表示转义 => /.jpg$/

③用法基础：.test(str);

写CSS，最繁琐的就是每个属性都要写冒号:，分号;，每个选择器都要带花括号{}。一次触键时间可能非常短，但是每行都要重复地输入一些符号，肯定会增加编码时间。后来出现了Less和Sass这些预编译语言，却依然没有减少这些冗余符号的输入，从这点上来说，我真的很不明白它们怎么会起Less这样的名字，也奇怪为什么它们这么火。（好吧，需要承认的是，能nesting，能写mixin和function等等的确是减少了时间，而且这些都发生在Stylus出生以前）

这段时间翻了一番JavaScript的api，发现不少好的轮子，省去造的麻烦了。