谷歌正在为最新版本的Chrome浏览器 – Chrome 76添加对本机延迟加载的支持。
在公告中,该公司声明:
“从Chrome 76开始,您将能够使用新的加载属性来延迟加载资源,而无需编写自定义延迟加载代码或使用单独的JavaScript库。”
延迟加载会延迟加载低于图像的图像,直到用户开始向它们靠近滚动。
最终结果是加载时间更短,用户带宽最小化,内存使用量减少。
以前,为了利用延迟加载,开发人员必须使用Intersection Observer API或实现复杂的事件处理程序。
现在,在Chrome中直接支持延迟加载,开发人员可以在嵌入图片时添加简单的“加载”属性。
以下是将loading属性添加到图像和iframe时代码的外观:
只要您具备HTML的一些基本知识,您甚至不需要开发人员的专业知识来实现加载属性。这使得延迟加载可供更多网站所有者访问。
loading属性支持以下值:
- auto:浏览器的默认延迟加载行为,与不包含该属性的行为相同。
- lazy:延迟加载资源,直到达到距视口的计算距离。
- 渴望:立即加载资源,无论它在页面上的位置如何。
此功能将继续更新,直到Chrome 76的稳定版本发布。
对于不支持新的“loading”属性的浏览器,仍然需要通过JavaScript实现延迟加载的旧方法。