懒加载如今在网站中经常看到，当用户打开一个网页的时候，图片资源并不是马上加载的，当用户浏览到图片的文章，再去加载图片，能够提升整个网站的访问速度和用户体验，特别是网站的图片比较多的站点。
通过 lazysizes.js 插件就能很好解决这个问题，它可以实现图片的延迟加载，也就是说，当网页很长时，只价值用户视窗内的图片，而视窗外的图片会等到你拖动滚动条至后面才加载。这样就有效避免了图片过度网站加载慢的问题了，下面将介绍如何使用 lazysizes.js。
< script src="lazysizes.min.js" async=""></ script >开始使用
使用是十分简单的，并且不需要加入 jQuery 库。
Step 1: 下载 lazysizes.min.js 插件并将其引入到你的网站上：
<script src="lazysizes.min.js" async=""></script>Step 2: 将 class="lazyload" 添加要延迟加载的 <images> 或 <iframes> 即可。
<!— 默认方案 –><img data-src="image.jpg" class="lazyload" />lazysizes不需要任何JS配置，只需要在img标签中添加class="lazyload"就可以了，目前lazysizes支持四种懒加载方式，如下。