推迟显示屏幕外图片

Lighthouse 报告的“优化建议”部分会列出您页面中的所有屏幕外或隐藏的图片，以及可能节省的千比字节 (KiB) 图片。考虑在所有关键资源加载完毕后延迟加载这些图片，以缩短可交互时间：

另请参阅“使用 lazysizes 延迟加载屏幕外图片”Codelab。

针对特定堆栈的指南

AMP

使用 amp-img 自动延迟加载图片。请参阅映像指南。

Drupal

安装可以延迟加载图片的 Drupal 模块。此类模块能够推迟加载所有屏幕外图片以提高性能。

Joomla

安装能够延迟加载所有屏幕外图片的延迟加载 Joomla 插件，或者改用可提供该功能的模板。从 Joomla 4.0 开始，您可以使用“Content - Lazy Loading Images”插件启用专用的延迟加载插件。此外，您还可以考虑使用 AMP 插件。

Magento

请考虑修改产品和目录模板，以利用 Web 平台的延迟加载功能。

WordPress

安装能够延迟加载所有屏幕外图片的延迟加载 WordPress 插件，或者改用可提供该功能的主题背景。此外，您还可以考虑使用 AMP 插件。

资源

• 推迟屏幕外图片审核的源代码