Reduzir o tamanho do conteúdo acima da dobra

Esta regra é acionada quando o PageSpeed Insights detecta os movimentos de ida e volta adicionais na rede que são necessários para processar o conteúdo da região acima da dobra na página.

Visão geral

Se a quantidade de dados necessária ultrapassar a janela de congestionamento inicial (em geral, 14,6 KB compactados), serão necessários ciclos adicionais de envio entre o servidor e o navegador do usuário. Para usuários em redes com latências altas, como as redes móveis, isso pode causar atrasos significativos no carregamento da página.

Recomendações

Para acelerar o carregamento das páginas, limite o tamanho dos dados (marcação HTML, imagens, CSS, JavaScript) que são necessários para processar o conteúdo da região acima da dobra na página. Há diversas maneiras de fazer isso:

Estruturar seu HTML para carregar primeiro somente o conteúdo essencial, da região acima da dobra.

Primeiro, carregue o conteúdo principal da sua página. Estruture-a para que a resposta inicial do servidor envie os dados necessários para processar imediatamente a parte essencial da página e adiar o resto. Para isso, talvez seja preciso dividir o CSS em duas partes: uma parte in-line, responsável por configurar a parte do conteúdo acima da dobra, e a parte que pode ser adiada.

Veja como é possível reestruturar um site para aumentar a velocidade de carregamento:

  • Caso seu HTML carregue os widgets de terceiros antes do conteúdo principal, altere a ordem para carregar o conteúdo principal antes.
  • Se o site usa um layout de duas colunas com uma barra lateral de navegação e um artigo, mas o HTML carrega a barra lateral antes do artigo, considere carregar o artigo antes.

Reduzir a quantidade de dados usados pelos recursos.

Assim que seu site for reprojetado para funcionar com eficiência em vários dispositivos e carregar o conteúdo essencial primeiro, use as técnicas a seguir para reduzir a quantidade de dados necessários para renderizar sua página: