Through Lazy Load pictures will not be loaded until they are in the viewport of the browser. This reduces both loading times and traffic use.
When Lazy Load is activated the address in the src-attributes of all <img>-tags will be removed and replaced with a small, transparent GIF.
Before the modification for Lazy Load
<img src="my-picture.png" alt="My Picture">
After the modification for Lazy Load
<img data-src="my-picture.png" src="data:image/gif;base64,R0lGODdhAQABAIAAANk7awAAACH5BAEAAAEALAAAAAABAAEAAAICTAEAOw==" alt="My Picture">
As soon as the picture is in the viewport its original address is restored via JavaScript and the picture will be shown. Only now the picture will be loaded from the server.
This uses the Intersection Observer API, which is supported by modern browsers. If the API is not supported by the browser the picture will be loaded immediately.
Please deactivate Lazy Load if there are pictures missing in sliders.
It is possible that tools like e.g. Pingdom show the website without pictures in their preview as the presentation of the pictures depends on JavaScript.