Lazy loading é uma técnica que carrega imagens somente quando elas aparecem na área visível do navegador. Isso reduz o tempo inicial de carregamento e economiza dados para os visitantes.

Por que é importante:

  • Melhora a performance, especialmente em dispositivos móveis.
  • Reduz o uso de largura de banda.
  • Otimiza o tempo de carregamento para páginas com muitas imagens.

Passo a passo de implementação:
Adicione este código ao arquivo functions.php:

function add_lazy_loading($content) {
    if (!is_admin()) {
        $content = str_replace('<img', '<img loading="lazy"', $content);
    }
    return $content;
}
add_filter('the_content', 'add_lazy_loading');

Resultados esperados:

  • Todas as imagens carregadas no conteúdo terão o atributo loading="lazy".
  • Redução do tempo de carregamento inicial das páginas.

Conclusão:
Essa abordagem adiciona lazy loading de maneira simples e eficiente, sem depender de plugins.

Categorized in:

WordPress,