loading-attribute-polyfill demo page

The sample images embedded into this document are including textual information on their embedding technique, like the HTML tag, attributes and pixel density to show you that the correct image has been loaded.

Notice: We previously had images included here in the first visible viewport aka "above the fold" as well for testing purposes - including them this way on a demo page was misleading, compare to the following advice.

You should avoid setting `loading=lazy` for any images that are in the first visible viewport.
It is recommended to only add `loading=lazy` to images which are positioned below the fold, if possible.

These are some of the relevant remarks within the section "Avoid lazy-loading images that are in the first visible viewport" in the article Browser-level image lazy-loading for the web published on web.dev

Please scroll down to see these images being loaded by the polyfill on unsupported browsers

dynamic images

Add div element and image underneath (scroll down after pressing the following button)