Defer offscreen images

Published on Updated on

Translated to: Español, Português, 한국어, Pусский

The Opportunities section of your Lighthouse report lists all offscreen or hidden images in your page along with the potential savings in kibibytes (KiB). Consider lazy-loading these images after all critical resources have finished loading to lower Time to Interactive:

A screenshot of the Lighthouse Defer offscreen images audit

See also Lazy load offscreen images with lazysizes codelab.

Stack-specific guidance


Automatically lazy-load images with amp-img. See the Images guide.


Install a Drupal module that can lazy load images. Such modules provide the ability to defer any offscreen images to improve performance.


Install a lazy-load Joomla plugin that provides the ability to defer any offscreen images, or switch to a template that provides that functionality. Starting with Joomla 4.0, a dedicated lazy-loading plugin can be enabled by using the "Content - Lazy Loading Images" plugin. Also consider using an AMP plugin.


Consider modifying your product and catalog templates to make use of the web platform's lazy loading feature.


Install a lazy-load WordPress plugin that provides the ability to defer any offscreen images, or switch to a theme that provides that functionality. Also consider using the AMP plugin.


Updated on Improve article

This site uses cookies to deliver and enhance the quality of its services and to analyze traffic. If you agree, cookies are also used to serve advertising and to personalize the content and advertisements that you see. Learn more about our use of cookies.