Chrome native lazyload
Chrome 76 introduced native lazy-load. This means that lazy-loading can be done by the browser itself instead of a plugin.
At the moment, Chrome's implementation of native lazy-load is very conservative. The purpose of lazy-load is to only load images onto the page as the user scrolls and needs to see them. However, Chrome's implementation sets a very large threshold which means that on many web pages, all or most of the images will be downloaded immediately and will not benefit from lazy-load.
WP Rocket's LazyLoad has a smaller threshold, therefore more images will be lazy-loaded, so it is currently more effective in reducing the amount of data transferred on initial page load. For this reason we have not automatically enabled support for native lazy-load.
But you can choose to enable support for Chrome's native lazy-load if you wish by using the helper plugin below.
How native lazy load works
To take advantage of Native lazy-load, your site must use certain HTML markup on its images:
loading="lazy" should be added to <img> and/or <iframe> tags.
<img src="image.png" loading="lazy" alt="cat">
When you activate the helper plugin it will do the following:
- Add the necessary HTML markup to your images to take advantage of native lazy-load
- Compatible Chrome browsers will automatically use native lazy-loading
- All others will automatically use WP Rocket's LazyLoading