Chrome 81,FF 75(今天最新)
在Chrome本机图像中,延迟加载仅适用于iframe。为什么?在FF中效果不错
[page1.htm(延迟加载在Chrome中不起作用,但在FF中效果很好):
<p style="margin-bottom: 1000px;">Please scroll down. The image is below the viewport.</p>
<p style="margin-bottom: 1000px;">Please scroll down. The image is below the viewport.</p>
<img src="https://wallpaperplay.com/walls/full/5/e/a/218959.jpg" loading="lazy">
[page2.htm(通过iframe的延迟加载在Chrome和FF中均有效:
<iframe src="page1.htm">
是Chrome的错误吗?在FF中效果很好
((您可以通过滚动和开发人员工具->网络检查图像延迟加载)
我有相同的问题,但是当图像靠近视口足够时仅。否则,它会延迟加载。
[请尝试在Chrome中打开这个最小的工作示例,然后缓慢向下滚动页面。当视口大约在页面中间时,将加载图像。
<html>
<head>
<style>
.dummy {
height: 700vh;
}
</style>
</head>
<body>
<div class="dummy"></div>
<img src="https://yasminfinch.com/wp-content/uploads/2015/03/Hello-icon-300x212.jpg" loading="lazy">
</body>
</html>
没有信心,我可以建议这是一项功能,而不是错误。某种优化。例如,当用户足够快地向上/向下滚动时,它减少了看到图像正在加载的机会。