LCP
LCP (Largest Contentful Paint) é a métrica que mede quanto tempo o maior elemento visível da página demora para ser renderizado para o usuário.
LCP significa Largest Contentful Paint. Em português, é algo como a renderização do maior conteúdo visível. A métrica mostra quanto tempo leva para o principal elemento da área visível da página aparecer para o usuário.
Esse elemento pode ser uma imagem de destaque, um bloco grande de texto, um banner, um vídeo ou uma seção hero. Quando ele demora para aparecer, o usuário sente que a página está lenta, mesmo que outros elementos menores já tenham carregado.
O que costuma piorar o LCP
Imagens grandes sem compressão, servidor lento, CSS bloqueante, JavaScript pesado e falta de cache são causas comuns. Em sites WordPress, temas pesados, plugins demais e hospedagem fraca costumam aparecer entre os principais gargalos.
Como funciona na prática
- O navegador começa a carregar a página e identifica os elementos visíveis acima da dobra
- A cada etapa de renderização, calcula qual é o maior elemento de conteúdo exibido
- Quando o maior elemento principal termina de aparecer, o tempo é registrado como LCP
- Ferramentas de performance comparam esse tempo com os limites recomendados
- A otimização foca no recurso que está atrasando esse elemento principal
Exemplo Prático
A página inicial de uma empresa usa uma imagem hero de 2 MB. Como essa imagem é o maior elemento visível, ela vira o LCP. Ao converter a imagem para WebP, ajustar dimensões e aplicar preload, o carregamento percebido melhora bastante.
Por que isso é importante?
LCP importa porque mede o momento em que a página parece realmente útil para o visitante. Melhorar LCP reduz sensação de lentidão, melhora a experiência mobile e ajuda páginas importantes a competirem melhor em SEO.
Perguntas Frequentes (FAQ) sobre LCP
Qual é um bom tempo de LCP?
Como referência geral, o ideal é que o LCP fique até 2,5 segundos. Acima disso, já existe sinal de que o conteúdo principal está demorando para aparecer.
Lazy loading melhora ou piora o LCP?
Depende. Lazy loading ajuda imagens abaixo da dobra, mas pode piorar o LCP se for aplicado na imagem principal da página. O elemento de LCP deve ser priorizado, não adiado.