Easier Lazy Loading (for Chrome)
So, Chome 76 (or later. But what version of Chrome am I running anyway?) is getting a feature that would have saved me at least a little work on a few client projects. That is, it’s making lazy-loading of images and iframes as easy as:
<img src="image.png" loading="lazy" alt="…" width="200" height="200"> <iframe src="https://example.com" loading="lazy"></iframe>
What’s lazy loading? As you might have guessed from the name alone, it’s when a browser that’s not currently showing an image (in the “viewport”, or part of a page it’s showing) doesn’t actually download that image. This means that if you’re on a slow connection, you’ll load each image as you need to see it, rather than it just seeming to take forever to load the page initially. It’s generally regarded as a best practice, but it’s never been easy.
Previously, to add lazy loading of images to a page you’d have to go through and change out the page markup and then load in the
loading="lazy" line to each image (or iframe) you want lazy loaded.
The “if” I said above it my one source of hesitation here. I don’t know a lot about what the standards bodies internal functioning is, or if this is the standard way that a web standard eventually gets approved. But my (unfounded) nervousness about Google making the HTML that supports them (vs the open web) is the only reason this is anything but unalloyed *great* news to me.