Adiar imagens fora da tela

A seção "Oportunidades" do relatório do Lighthouse lista todas as imagens fora da tela ou ocultas na sua página, além da possível economia em kibibytes (KiB). Considere fazer o carregamento lento dessas imagens depois que todos os recursos críticos terminarem o carregamento para diminuir o Tempo para interação da página:

Captura de tela da auditoria de adiamento de imagens fora da tela do Lighthouse

Consulte também o codelab Carregamento lento de imagens fora da tela com Lazysizes.

Orientações específicas para a pilha

AMP

Carregar imagens automaticamente de maneira lenta com o amp-img. Consulte o guia Imagens.

Drupal

Instale um módulo Drupal que possa fazer o carregamento lento de imagens. Esses módulos oferecem a capacidade de adiar imagens fora da tela para melhorar o desempenho.

Joomla

Instale um plug-in de carregamento lento do Joomla (link em inglês), que permite adiar imagens fora da tela, ou alterne para um modelo que ofereça essa funcionalidade. A partir do Joomla 4.0, um plug-in de carregamento lento dedicado pode ser ativado usando o plug-in "Content - Lazy Loading Images". Considere também usar um plug-in de AMP.

Magento

Modifique seus modelos de produto e catálogo para usar o recurso de carregamento lento da plataforma da Web.

WordPress

Instale um plug-in de carregamento lento do WordPress que ofereça a capacidade de adiar imagens fora da tela ou alterne para um tema que ofereça essa funcionalidade. Considere também usar o plug-in de AMP.

Recursos