It seems to be the week for dropping news of WordPress feature plugins. Felix Arntz, WordPress core committer and developer programs engineer at Google, announced a plan to push a lazy loading feature to the platform. If testing goes well, this feature could land in WordPress 5.4 in March.
The concept of lazy loading allows a webpage to render without loading certain resources until they are needed. This leads to faster page loads and saves data on the visitor’s end. Lazy loading is particularly useful when rendering images on the web.
The opposite of lazy loading is called eager loading, which loads everything in bulk. By default, this is how all images are loaded on the web. This often leads to poor performance on image-heavy webpages where many of the images are not in the site visitor’s viewport when first viewing the page.
loading attribute to an
<iframe> element. Browsers can then decide how to load a resource based on the value of the attribute. Currently, Chrome, Edge, and Opera all handle the loading attribute. Once the attribute officially makes it into the HTML specification, the feature should be a standard that all browsers support.
It is refreshing to see the continued work by core contributors on more robust image solutions. Along with WordPress 5.3’s large image size handling, both features will lead to a generally faster web. With more users loading high-quality images via mobile phones over the past few years, it has only exacerbated the problem of a slow web. That is why it imperative that WordPress continually push for image optimization.
“With WordPress enabling native lazy-loading by default, it would significantly impact performance and user experience for millions of sites, without requiring any technical knowledge or even awareness of lazy-loading as a concept,” wrote Arntz in the announcement post. “Adopting the new loading attribute is a great chance for WordPress to lead the way for a faster web overall.”
Arntz and a team of engineers originally released a native lazy loading plugin in September 2019. This was shortly after Google brought the “loading” attribute feature to version 76 of its Chrome browser. The Native Lazyload plugin currently has over 7,000 installations.
How This Affects Existing Plugins
Because not all web browsers support the loading attribute, users may not want to automatically drop their current plugins when the feature lands in WordPress. Users may choose to support browsers without native lazy loading for a while
The proposed code within the Lazy Loading plugin attempts to detect whether the
loading attribute exists on an image before applying it. This means the code should play nicely with existing plugins and avoid conflicts in most cases.
Developers of plugins that handle lazy loading need to start testing their plugins and updating them for WordPress 5.4. Follow the Lazy Loading API ticket on core Trac to stay updated on when the feature lands and the GitHub repository for contributing to its development.
The big issue with native lazy load currently in Chromium is the thresholds values used: images start to be lazy loaded only if they are 3000 to 8000 pixels below the fold, depending on your connection type: https://cs.chromium.org/chromium/src/third_party/blink/renderer/core/frame/settings.json5?l=971-1003&rcl=e8f3cf0bbe085fee0d1b468e84395aad3ebb2cad
These values are huge, especially compared to what is currently used by most lazy load plugins out there.
If someone was not using a plugin for that before, it will go from no changes to a possible improvement, but If they switches from a plugin solution to the native solution after 5.4, they might in fact face a decrease of performance and loading time on their website, instead of an expected increase.