Even though there’s a promise of native lazy loading with the launch of Chrome 75, between now, then, and the time period for the other browsers to adopt it as well, we have to continue developing our own lazy loading implementations using JavaScript. From Phil Hawksworth on CSS Tricks:

In this post, we’ll look at an implementation that’s already been covered in brief detail in this post by Preerhi. We’re going to expand on that so you can add your own implementation of lazy loading to your site site as I’ve done on this little demo site.

Phil covers these topics…

• The HTML markup for lazy loading
• Spotting when to load images with Intersection Observer
• Adding support for responsive images with picture and source elements
• Creating an attractive initial state with small images and CSS
• Mass-producing image assets
• Creating helpers to generate the required HTML