Google revealed on July 24, 2020 that Google Chrome and Chromium-based web browsers support the lazy loading of iframe content now. The integration of the feature comes right after Google introduced support for the lazy loading of images in Chromium and Chrome. Mozilla's Firefox web browser supports the lazy loading of images as well.
Technically speaking, lazy loading keeps the browser from loading certain content until it is accessed by the user. When a page is loaded for the first time, content that is not visible, below the fold, may be lazy loaded. When a user scrolls down, content gets loaded while the scroll action takes place.
The lazy loading of iframes in Chromium-based web browsers follows the same methodology. Webmasters need to use the loading="lazy" attribute for iframes in the code of the site to inform the browser that the content should not be loaded right away. Browsers that don't support the functionality will ignore the attribute while browsers that support it will handle the loading accordingly.
Google ran a few tests to determine the effect of the lazy loading of iframes. It noted the following:
Generally speaking, lazy loading of offscreen iframes leads to 2-3% median data savings, 1-2% first contentful paint, and 2% first input delay.
Google notes that there is also potential to use the loading attributes for advertisement on websites.
Webmasters need to specify the loading="lazy" parameter to get browsers that support lazy loading to postpone the loading until the content is accessed. It is furthermore possible to use the "eager" parameter to inform the browser that content should be loaded right away, and to use "auto" to let the browser decide.
Google implemented an exception into the Lite mode on Chrome for Android. Lite mode, or Data Saver mode is a special mode supported by Chrome for Android that is been designed to improve the loading performance by using Google servers to load content faster. Offscreen images and iframes are automatically lazy-loaded if Lite mode is active in the Chrome web browser.
Lazy loading's main goal is to speed up the initial loading of a website. The content that is not loaded initially when the site is loaded is loaded when users scroll on the page; this may result in some content being not displayed right away depending on the speed of scrolling and the device's and network's performance.
Now You: Lazy loading, yay or nay, what is your take? (via Techdows)
Ghacks is a technology news blog that was founded in 2005 by Martin Brinkmann. It has since then become one of the most popular tech news sites on the Internet with five authors and regular contributions from freelance writers.