Core Web Vitals 2026: Guia Definitivo LCP, CLS e INP

Os Core Web Vitals são métricas oficiais do Google que medem a experiência real do usuário em uma página web. Em 2026, três métricas dominam: LCP, CLS e INP. Vamos destrinchar cada uma e como otimizá-las na prática.

LCP - Largest Contentful Paint

O LCP mede o tempo que o maior elemento visível da página leva para renderizar. O threshold recomendado pelo Google é de 2.5 segundos ou menos. Para melhorar o LCP:

• Use CDN com edge computing para reduzir latência
• Comprima e converta imagens para WebP ou AVIF
• Elimine render-blocking JavaScript
• Use preload para fontes críticas
• Renderize o conteúdo above-the-fold no servidor

CLS - Cumulative Layout Shift

O CLS mede o quanto o layout da página se move visualmente durante o carregamento. O threshold recomendado é menor que 0.1. Para reduzir o CLS:

• Sempre defina width e height em tags <img> e <video>
• Reserve espaço para anúncios e iframes
• Evite inserir conteúdo acima de conteúdo existente
• Use font-display: swap com tamanho de fonte similar

INP - Interaction to Next Paint

O INP é a métrica mais nova, substituindo o FID. Ela mede o tempo entre uma interação do usuário (clique, toque, teclado) e a próxima pintura na tela. O threshold recomendado é menor que 200ms. Para melhorar o INP:

• Minimize o trabalho de JavaScript no main thread
• Use requestIdleCallback para tarefas não críticas
• Implemente code splitting agressivo
• Evite long tasks (>50ms)

Ferramentas de medição

Use o Lighthouse no Chrome DevTools, o PageSpeed Insights, o Web Vitals Chrome Extension e o Search Console para monitorar Core Web Vitals em produção. Configure alertas de regressão em CI/CD para evitar deploys que degradem essas métricas.

Conclusão

Core Web Vitals não são mais opcionais. Sites lentos perdem ranking e conversão. Invista em otimização contínua, monitore em produção e trate performance como feature, não como nice-to-have.