懒加载、瀑布流

懒加载

懒加载是通过延迟加载不可见元素，提升网页性能，减少同一时间服务器请求的一种方式。当用户滚动当前页面时再去自动请求更多的数据，一次可加载固定数量数据，然后判断滚动是否到当前加载的所有元素的底部，当到达时再触发滚动事件则继续自动请求数据，加载新的元素。
图片懒加载示例

瀑布流

瀑布流布局是一种页面元素等宽不等高，显示参差不齐的多栏布局。绝对定位实现瀑布流的方式是，根据父元素宽度与其中子元素的宽度确定页面显示列数，然后设置一个数组，存储每列所有元素的总高度，且随页面元素增加而实时变动，每次向页面添加元素时先找出当前页面高度最小的列向其中添加。
当时用绝对定位务必每次添加完元素修改父元素的高度，否则父元素高度与内部总高度不等，会影响其后非瀑布流元素。
绝对定位实现瀑布流

瀑布流布局

瀑布流缺点：

1. 无法得知页面总高度
2. 用户无法得知自己所在位置
3. 容易产生浏览疲劳
4. 增加页面加载负荷

判断元素出现在视野内、判断页面加载到底部

二者判断方式基本相同，但是瀑布流中需要在瀑布流之外的最底端设置一个标志位元素，通过判断该元素是否出现在视野中来判断是否加载到底部
client、offset、scroll值
element.scrollHeight - element.scrollTop === element.clientHeight
$(element).offset().top - $(window).outerHeight === $(window).scrollTop()