摘要：今天给大家带来好消息是，将原生支持图片的惰性加载，支持对和进行延迟加载，只需要将属性设置为即可。该属性支持标签，无论标签是否含有属性及被标签包裹，以及标签。
随着浏览器性能的提升，前端也越来越关注用户体验，而影响用户体验其中一个很重要的指标便是受首屏渲染速度。我们常常会针对样式、脚本、图片、音频、视频等资源做处理，比如针对样式和脚本的压缩合并，将图片合并成雪碧图、将小图转化成base64、延迟加载等减少网络请求次数。
现在大部分web应用含有大量的图片，对图片进行延迟加载无疑极大提升用户体验。以往我们可能会通过对比底部图片据可视区底部距离、窗口高度、滚动条距离来判断是否加载新图片，抑或在支持IntersectionObserver API的浏览器中使用交叉区观察者进行监听，而这都需要我们写脚本去判断及控制。
今天给大家带来好消息是，Chrome 75 将原生支持图片的惰性加载，支持对img和iframe进行延迟加载，只需要将loading属性设置为lazy即可。
loading属性
Loading属性控制浏览器是否延迟加载屏幕外的图像和iframe：
lazy：对资源进行延迟加载。
eager：立即加载资源。
auto：浏览器自行判断决定是否延迟加载资源。
默认效果（不设置该属性）和loading=auto的效果保持一致。需要注意的是，若浏览器决定该资源适合延迟加载，则需要避免页面不正常显示和影响用户体验。
该loading属性支持img标签，无论img标签是否含有srcset属性及被picture标签包裹，以及iframe标签。
示例代码：
最新活动
