O que é
Antes de um navegador conseguir mostrar qualquer parte de uma página, tem primeiro de descarregar por completo o documento HTML da página (ou pelo menos o suficiente para começar a trabalhar) — isto é independente de imagens, vídeos ou outros conteúdos multimédia, que carregam depois. Esta verificação analisa especificamente o tamanho desse documento HTML inicial, assinalando-o quando cresceu de forma invulgarmente grande.
Os documentos HTML normalmente incham de tamanho quando muito conteúdo é incorporado diretamente em linha — grandes blocos de código de estilo, scripts, ou conteúdo repetido colado diretamente na página — em vez de serem mantidos em ficheiros separados e reutilizáveis que o navegador pode carregar uma vez e guardar em cache.
Por que importa
Um documento HTML maior demora mensuravelmente mais tempo a descarregar e a processar antes de o navegador poder começar a desenhar seja o que for, o que atrasa a primeiríssima coisa que um visitante vê, não apenas conteúdo secundário mais abaixo na página. Este efeito é mais acentuado em ligações móveis mais lentas, onde cada dado extra acrescenta tempo real e percetível antes de a página começar a parecer responsiva.
Um ficheiro HTML inchado é também frequentemente sintoma de um problema estrutural mais profundo — conteúdo ou código que devia ter sido organizado em ficheiros separados e passíveis de cache, mas que em vez disso está duplicado em linha ao longo da página, ou até em todas as páginas do site.
Como corrigir
- Identifica o que está a ocupar a maior parte do ficheiro — as ferramentas de programador do navegador podem mostrar a distribuição do tamanho dos recursos de uma página, incluindo o próprio documento HTML base.
- Move grandes blocos de CSS em linha (código de estilo) para um ficheiro
.cssseparado, que o navegador pode carregar uma vez e reutilizar em várias páginas, em vez de o repetir em linha em cada página. - Move grandes blocos de JavaScript em linha para ficheiros
.jsseparados, pela mesma razão. - Verifica se há conteúdo duplicado por engano no código da página (o mesmo bloco repetido mais do que uma vez) e remove as duplicações.
- Se usas um construtor de sites, isto costuma ser gerido automaticamente — uma página invulgarmente grande aqui é mais frequentemente causada por um bloco de código personalizado pesado do que pela própria plataforma, por isso revê quaisquer blocos de código personalizado que tenhas adicionado.