HTML5 Effects: How to Lazy load images to make pages faster - demo page

This page demonstrates lazy-loading images. At the bottom of the page there's an image that is not loaded until you scroll to it. You can see this in the Chrome dev tools waterfall chart: open the Chrome dev tools, click to the network panel, position the window so that you can see it and the browser, and then scroll to the bottom of the page. When you get to the image the browser will make a new request for the image and display it.

« Back to the article

Scroll down to see the image.





























































RGraph logo