Mueller, do Google, sinaliza um caso sobre por que as correções de LCP erram o alvo
O defensor da pesquisa do Google, John Mueller, destaca um novo estudo de caso que explica por que certas melhorias no Largest Contentful Paint muitas vezes não produzem resultados. Em um layout que varia de acordo com a loja, o navegador pode focar no elemento errado, fazendo com que todas as otimizações subsequentes direcionem algo que nunca foi o LCP.
O estudo de caso foi publicado no web.dev em 24 de junho e detalha um ano de trabalho do Core Web Vitals na plataforma de comércio eletrônico Nuvemshop. Inicialmente, a equipe suspeitou que o peso da imagem ou a latência do servidor fossem os principais problemas. No entanto, a análise deles apontou para como o navegador selecionou o elemento LCP. Depois de otimizar a seleção de elementos, prioridade de imagem, carregamento lento e cache de borda, a Nuvemshop relata que a participação de suas lojas com boas pontuações de LCP aumentou de 57% para 96%.
Como o elemento errado é escolhido
Na Nuvemshop, os comerciantes podem organizar as seções de sua página inicial na ordem que preferirem, resultando em carrosséis, banners e grades de produtos aparecendo em várias posições em diferentes temas. De acordo com o estudo de caso, os carrosséis estavam presentes em 85% das vitrines e foi aí que a medição encontrou um problema.
O problema resultou de transições CSS em carrosséis e banners. Essas transições foram atrasadas quando os elementos se tornaram visíveis para a detecção do LCP do navegador. Embora os compradores vissem o carrossel carregar primeiro, o navegador ocasionalmente identificava um banner mais abaixo como o elemento LCP porque sua visibilidade não era atrasada por uma transição. Consequentemente, segundo a Nuvemshop, os esforços anteriores de otimização focaram em elementos que nunca foram o LCP.
A investigação identificou três causas principais. As transições empurravam a detecção para o quadro errado, o carregamento lento atrasava as imagens acima da dobra que precisavam ser carregadas imediatamente e as imagens críticas não tinham sinais de prioridade. Além disso, as medições originaram-se das páginas de categorias e de produtos, e não apenas das páginas iniciais, portanto, a solução precisava ser eficaz em diferentes tipos de páginas.
As três correções do LCP
O estudo de caso inclui uma quarta mudança, cache de borda para reduzir a latência. No entanto, os principais ajustes de detecção de elementos envolveram três modificações na forma como a parte superior da página é renderizada e carregada. A Nuvemshop implementou todas as três mudanças em seus principais temas e tipos de páginas. Esses ajustes são simples, seguindo as práticas recomendadas comuns de desempenho da web.
A equipe removeu as transições CSS das seções superiores para que fossem exibidas instantaneamente, permitindo que o navegador as reconhecesse como candidatas a LCP sem demora.
Eles também puxaram loading="lazy" fora da primeira imagem nessas seções superiores. A própria orientação do web.dev é direta sobre isso, alertando contra o carregamento lento da imagem LCP porque sempre adiciona atraso de carregamento.
A última peça foi fetchpriority="high" na provável imagem LCP, que informa ao scanner de pré-carregamento do navegador para capturá-la mais cedo. A Nuvemshop diz que envolveu isso na lógica de validação, de modo que o sinal é acionado apenas onde o elemento poderia realmente ser o candidato ao LCP. O conselho do Google é reservar o atributo para uma ou duas imagens principais, pois se tudo for de alta prioridade, nada será.
O que mais a Nuvemshop relata
A Nuvemshop relata que sua taxa geral de aprovação do Core Web Vitals melhorou de 48% para 72% ao longo do ano, não apenas o valor do LCP.
A empresa analisou as mesmas lojas brasileiras ativas em janeiro de 2025 e 2026. Para visitantes móveis que chegam por meio da pesquisa orgânica do Google, ela relata um aumento de 8,9% na taxa de conversão e um aumento de 8,4% no engajamento do carrinho.
Tenha em mente que estes são números auto-relatados e que os números de compras são uma comparação ano após ano dessa coorte, não um teste controlado. A Nuvemshop vincula a direção ao seu trabalho de velocidade, apoiando-se na pesquisa da Deloitte encomendada pelo Google, que descobriu que reduzir 0,1 segundo no tempo de carregamento pode aumentar a conversão do varejo em 8,4%.
Por que isso é importante
Antes de compactar outra imagem principal, verifique novamente se você está otimizando o elemento que o navegador realmente trata como LCP. Isso é especialmente importante em layouts baseados em modelos ou com muitos carrosséis, onde pode não funcionar.
Nossa cobertura recente chega ao mesmo lugar. Olhando para Core Web Vitals em plataformas CMS, os dados do HTTP Archive mostraram que o LCP do mundo real tende a quebrar quando uma plataforma é lenta para permitir que o navegador descubra a imagem principal, ou quando força essa imagem a competir com muitos outros recursos de alta prioridade, não apenas quando uma página é pesada. Barry Pollard também explicou como rastrear um problema de LCP no PageSpeed Insights antes de tocar em qualquer código.
O link de conversão reflete a interpretação dos dados pela Nuvemshop. Core Web Vitals são apenas um fator menor de classificação, e o Google enfatizou a relevância como mais importante, portanto, uma loja mais rápida é melhor interpretada como um ganho de experiência de compra do que como uma alavanca de classificação.
Olhando para o futuro
Esta é apenas a experiência relatada por uma empresa, portanto, os ganhos de compras são melhor interpretados como direcionais. A técnica em si também não é nova, já que o web.dev vem defendendo esse tipo de trabalho de descoberta e prioridade há anos. O que o estudo de caso acrescenta é um exemplo prático de identificação do verdadeiro elemento LCP em layouts que variam de uma loja para outra, o que é a parte difícil em qualquer plataforma personalizável.
Imagem em destaque: vitoriatudos/Shutterstock
