图片懒加载的的原理和设置？提高网页访问速度的小技巧

对于不少站长来说，网站平时都要各种优化，其中图片的使用，也是必不可少，但是如果使用的过多，而服务器配置不高的话，可能会影响网页的打开速度，影响了体验了效果，那么有没有在使用图片多的时候，能提高网页的访问速度吗？

答案是有的哦。

如果不想提高服务器配置的话，可以试试懒加载。

懒加载也叫延迟加载，顾名思义，指的是在网页中延迟加载图片的时机，当用户需要访问网页时，先让网页加载出来，让浏览器把其他的内容渲染出来，然后在访问的过程中加载图片，这样可以提高网站的首屏加载速度，提升用户的体验，并且可以减少服务器的压力。

懒加载，页面很长的网站场景，如果服务器速度比较慢的时候，就能明显感觉到懒加载的优势了。

懒加载的实现原理，其实也简单，将页面上的图片的src属性设置为空字符串，将图片的真实路径保存在一个自定义属性中，当页面滚动的时候，进行判断，如果图片进入页面可视区域内，则从自定义属性中取出真实路径赋值给图片的src属性，以此来实现图片的延迟加载。这样做能防止页面一次性向服务器发送大量请求，导致服务器响应面，页面卡顿崩溃等。

以前想让网站图片懒加载，都是通过JS来实现，网上也有人写相应的代码或插件，有一些网站主题集成了懒加载的JS，其实从Chrome76开始（2019年发布），谷歌浏览器内核原生支持懒加载属性，直接在img标签里面加上【loading="lazy"】属性，浏览器会自动实现懒加载。

如果所使用的主题，已经集成了懒加载的标签，就就非常方便了，不用挨个设置了，如果主题里面没有，而还想使用懒加载的话，如果自己懂技术，可以通过修改主题加上懒加载，或者在文章添加图片的同时，在图片代码里，加上一段【loading="lazy"】属性，也能实现懒加载的效果。