从Google Chrome 77版本起,开始本地延迟功能。
如下引用原文:
I’m not sure how I missed native lazy loading in my last video! It’s pretty amazing, so I’m including it now. Lazy loading is a technique that allows you to defer the loading of non-critical resources, like off-screen <img>
's, or <iframe>
's - until they’re needed, increasing the performance of your page.
Starting in Chrome 76, the browser handles lazy loading for you, without the need to write custom lazy loading code, or use a separate JavaScript library.
To tell the browser you want an image, or iframe lazy loaded, use the loading=”lazy”
attribute. Images and iframes that are “above the fold” load normally. And those that are below, are only fetched when the user scrolls near them.、
<img src="image.jpg" loading="lazy" width="400" height="250" alt="...">
Check out Native lazy-loading for the web on web.dev for details.
原文链接: https://developers.google.com/web/updates/2019/09/nic77#lazy-loading