Google officially announced in April 2019 that Chrome will start supporting native lazy-loading of images and iframes.
This means that instead of developers relying on custom code to make images load lazily (as has been the case for so long), lazy-loading will now be automatically enabled at a browser-level (starting from Chrome 76).
Google has even released a WordPress plugin that allows site owners and web developers to take advantage of this new feature.
But why do you need lazy-loading in the first place?
Why Images Should Be Lazy-Loaded
Lazy-loading is also sometimes referred to as on-demand loading. It is a technique for optimizing web content with speed improvements being its major advantage.
Without lazy loading, an entire web page is loaded and the full page is rendered to the user at once. But with lazy-loading, only the sections of a web page that is immediately required by the user are loaded. The remaining sections of the web page is delayed until the user requests them by taking an action (such as scrolling down) on the page.
By loading content (images especially) lazily as described above, websites can significantly speed up their page load times which in turn could potentially improve the entire user experience. And since lazy-loaded pages are faster, they may also rank better in terms of SEO.
Lazy-Loading – Why You Should Go Native
If you don’t already have the lazy-loading feature implemented on your website, now might be a good time to consider it. But if you want lazy-loading, do you have to go with Google’s “brand new” native lazy-loading feature? Or should you instead continue using older custom code techniques?
Without getting into too much details of how lazy-loading works from a programmatic perspective, here are my thought on the matter…
Native lazy-loading largely does away with this pattern. It uses the new loading attribute, which makes lazy-loading a native browser feature. The attribute is currently supported on Google Chrome, and over time, it will gradually be rolled out to other browsers.
If your website is built on WordPress, you should grab Google’s native lazy-loading plugin from the WordPress plugin repo.
If you want to implement lazy-loading but don’t particularly care about native lazy-loading, check out the a3 Lazy Load plugin. I have used it myself in the past and recognize it to be pretty good at what it does.
To be fair, lazy-loading (be it native or traditional) also has a few disadvantages. I plan to touch on these in a future article.