论懒加载(Lazy-Load)的 Element 特性

    图片懒加载是一种网页优化技术。图片作为一种网络资源，在被请求时也与普通静态资源一样，将占用网络资源，而一次性将整个页面的所有图片加载完，将大大增加页面的首屏加载时间。为了解决这种问题，通过前后端配合，使图片仅在浏览器当前视窗内出现时才加载该图片，达到减少首屏图片请求数的技术就被称为“图片懒加载”。 意义： 懒加载的主要目的是作为服务器前端的优化，减少请求数或延迟请求数。

实现方式：

1.第一种是纯粹的延迟加载，使用setTimeOut或setInterval进行加载延迟.

2.第二种是条件加载，符合某些条件，或触发了某些事件才开始异步下载。

3.第三种是可视区加载，即仅加载用户可以看到的区域，这个主要由监控滚动条来实现，一般会在距用户看到某图片前一定距离前开始加载，这样能保证用户拉下时正好能看到图片。

    在最近接的一个项目里，却遇到了典型的 Dummy Class Name 出现在 Elements Item， 通过各种方法把这个 class =’ lazyloaded’ 去定位，却发现一样的报错，can’t fine element， 下图1

    打开“网页源代码” 再去查看，却发现真正的 class name 原来是 “lazyload"， 下图2 再用这个属性值去定位，果然成功了。这个其实也是懒加载其中一个比较典型的特征。

    懒加载其实还有其它的加载方式，例如上述的第三种，要实现逐一获取每个图片的信息，可以通过运用 JS 去执行滚动条的滚动。

图1

图2