Lazily load iframes and images via ‘loading’ attribute
Support the ‘loading’ attribute, which can be used to defer the load of below-the-fold iframes and images on the page until the user scrolls near them. This is to reduce data usage, memory usage, and to speed up above-the-fold content. Web developers can opt-in to lazy load by specifying loading=lazy on <iframe> and <img> elements.
Demos
Documentation
Specification
Status in Chromium
Enabled by default (tracking bug) in:
- Chrome for desktop release 76
- Chrome for Android release 76
Consensus & Standardization
After a feature ships in Chrome, the values listed here are not guaranteed to be up to date.
- No public signals
- No public signals
- Public support
- Positive
Owners
Intent to Implement url
Intent to Implement threadLast updated on 2019-08-07
Comments
Supported values for the ‘loading’ attribute include: * ‘lazy’ to defer the load until the image or iframe reaches a distance threshold from the viewport. * ‘eager’ to load the resource immediately. * ‘auto’ the default behavior, which is to eagerly load the resource. The distance threshold after which the deferred content will start loading-in depends on factors including the current effective connection type, and whether Lite mode is enabled. The distance is chosen so that the deferred content almost always finishes loading by the time it becomes visible. Note that if the developer doesn't include the ‘loading’ attribute, then the resources will be eagerly loaded as they always have been.