The new Headless mode now supports disabling lazy loading
Recently, I added support for disabling lazy loading to the new headless Chromium. Since the Google Chrome team announced the new headless mode, the new headless mode has gradually supported the old headless features. This was one of the missing features.
But, what does disabling lazy loading actually mean?
First, we need to understand what lazy loading is on the Web. Lazy loading is a technique that delays the loading of resources until they are needed. This can improve performance by reducing the amount of data that needs to be loaded initially.
For example, when a webpage has numerous images, users may have to scroll down the page to view the images. In such cases, the browser can defer the loading of the unseen images by using loading=lazy attributes for images. See this demo: https://enviragallery.com/demo/lazy-loading-demo/ So, why should we disable lazy loading in headless mode? In headless mode, the image lazy loading becomes unnecessary because users want to get a fully loaded page in order to capture a screenshot or generate a pdf. This applies not only to image loading but also to any sub-resources like JavaScript, CSS, and iframes as follows:
<img src="image.jpg" alt="..." loading="lazy" />
<iframe src="video-player.html" title="..." loading="lazy"></iframe>
This change was applied to the main branch of headess_shell and old headless mode on Jan 18, 2023
You can find more details about it here:
https://source.chromium.org/chromium/chromium/src/+/a4e84e7e99130c902d10209bb33903c110e359e7
If you wish to disable lazy loading in the new headless mode, make sure you are using the latest version of Chromium.
Here are some additional details about lazy loading: