We want to use the loading="lazy" property of the HTML for creating lazy loaded images in our web page.
Here is a sample HTML code:
<picture>
<source type="image/webp" srcset="example.webp">
<img loading="lazy" src="example.jpg" alt="" title="" fetchpriority="auto">
</picture>
In this particular HTML code, when we're dealing with multiple lazy loaded pictures in Chrome, it waits long enough to download all the pictures then starts displaying them. While the exact code runs differently in Firefox.
We expect that the browser shows pictures as soon as it could (like Firefox). How we could force Chrome and other Chromium based browsers to show the correct behavior?