Como a estratégia de priorização de imagens da Nuvemshop resultou em uma melhoria de 68% no LCP e 8,9% mais conversões

Federico Iglesias
Federico Iglesias
Jesus Biaggioni
Jesus Biaggioni
Kaio Graco Cardamone
Kaio Graco Cardamone
Lucas Demarchi
Lucas Demarchi
Mari Viana
Mari Viana

Publicado em: 24 de junho de 2026

A Nuvemshop (conhecida como Tiendanube na América Latina de língua espanhola) é a principal plataforma de e-commerce da região, com mais de 180 mil lojas on-line. Com os comerciantes personalizando as vitrines com vários temas e layouts de conteúdo dinâmicos, garantir carregamentos rápidos de página em toda essa diversidade apresenta desafios técnicos exclusivos.

  • A integridade do Largest Contentful Paint (LCP) melhorou 68%, de 57% para 96% em um ano, refletindo uma grande mudança na forma como as lojas renderizam o conteúdo na parte superior da janela de visualização para usuários reais.
  • A taxa de aprovação das Core Web Vitals aumentou de 48% para 72%, o que significa que quase 3 em cada 4 lojas agora atendem ao limite mínimo de performance do Google.
  • O engajamento do Shopping melhorou de forma mensurável:ao analisar a mesma coorte de lojas brasileiras ativas em janeiro de 2025 e janeiro de 2026, os visitantes de dispositivos móveis da pesquisa orgânica do Google mostraram:
    • Aumento de 8,9% na taxa de conversão (sessão para pedido pago)
    • Aumento de 8,4% na taxa de engajamento do carrinho (sessão para carrinho)
  • Os dispositivos móveis geraram os maiores ganhos, o que está de acordo com os locais em que as melhorias na LCP foram mais significativas.

Esses resultados estão alinhados com a pesquisa da Deloitte encomendada pelo Google (mais de 30 milhões de sessões em 37 marcas), que descobriu que uma melhoria de 0,1 segundo na velocidade de carregamento pode aumentar as taxas de conversão do varejo em 8,4%, validando a direção dos nossos investimentos.

O desafio: detecção de LCP em layouts dinâmicos de e-commerce

No início de 2025, apenas 48% das nossas lojas passaram nos limites das Core Web Vitals, e 57% tinham pontuações de LCP boas. Nossa hipótese inicial era o peso da imagem ou a latência do servidor. Estávamos errados.

Com a análise do PageSpeed Insights em milhares de lojas, descobrimos que nossa plataforma permite que os comerciantes organizem as seções da página inicial de forma dinâmica: carrosséis, banners, grades de produtos e módulos personalizados podem aparecer em qualquer ordem.

Essa flexibilidade introduziu um problema imprevisto: o elemento certo nem sempre era identificado como LCP. Em lojas com carrosséis, que representavam 85% das nossas vitrines, um banner mais abaixo na janela de visualização às vezes era marcado como LCP em vez da primeira imagem do carrossel, dependendo de como a página era renderizada em diferentes telas e dispositivos. Isso significava que nossos esforços de otimização não estavam tendo o efeito desejado: estávamos otimizando elementos que não eram de LCP.

Ao contrário das plataformas SaaS típicas, não foi possível apenas corrigir a página inicial. Precisávamos de uma solução que funcionasse em todas as configurações de temas, arranjos de seções e personalizações de comerciantes possíveis, sem prejudicar as lojas existentes ou limitar a liberdade criativa.

Como os layouts dinâmicos afetam a seleção de elementos LCP

Com a análise do PageSpeed Insights e o monitoramento de usuários reais, descobrimos que as transições de CSS em carrosséis e banners eram atrasadas quando os elementos ficavam visíveis para o algoritmo de detecção de LCP do navegador. Embora os usuários percebessem que o carrossel carregava primeiro, o navegador às vezes marcava um banner na segunda seção como o elemento LCP, porque a visibilidade desse elemento não era atrasada por efeitos de transição.

Identificamos três causas principais:

  • As transições de CSS eram atrasadas quando os elementos eram considerados visíveis, empurrando a detecção de LCP para o frame errado.
  • O carregamento lento foi aplicado às imagens na parte superior da janela de visualização que precisavam ser carregadas imediatamente.
  • A falta de indicadores de prioridade significava que as imagens mais importantes não eram carregadas primeiro.

Também descobrimos que uma parte significativa das medições de LCP veio de páginas de categorias e produtos, não apenas páginas iniciais. Isso significa que nossas correções precisavam ser aplicadas de forma consistente em todos os tipos de páginas com muito tráfego.

Implementação: correção das três causas principais em grande escala

Com as causas identificadas, as correções foram simples. Aplicamos essas mudanças de forma consistente em todos os temas principais e tipos de página, mas cada uma exigiu um escopo cuidadoso para evitar a criação de novos problemas.

  • Transições de CSS removidas para seções de primeira posição. As seções que aparecem primeiro na página agora são renderizadas imediatamente, garantindo que o navegador as detecte como candidatas a LCP sem atrasos artificiais.
  • Removido o carregamento lento das imagens na parte de cima da janela de visualização. Para imagens na primeira seção, removemos condicionalmente loading="lazy" para eliminar o atraso no carregamento de recursos. Tivemos cuidado para limitar isso apenas à primeira imagem em seções de primeira posição:

    <!-- Before -->
    <img src="slide-1.webp" loading="lazy" alt="Featured product">
    <!-- After -->
    <img src="slide-1.webp" alt="Featured product">
    
  • Adição de indicadores de prioridade explícitos. Ao adicionar fetchpriority="high", informamos ao scanner de pré-carregamento do navegador que a imagem LCP é um recurso de alta prioridade, permitindo que ela seja descoberta e baixada antes da conclusão do layout e da renderização. Adicionamos uma lógica de validação para garantir que os indicadores de prioridade só sejam aplicados quando o elemento estiver em uma posição em que possa ser o candidato a LCP. Adicionar fetchpriority="high" a muitas imagens seria contraproducente, já que, se tudo for de alta prioridade, nada será.

    <!-- Before -->
    <img src="slide-1.webp" alt="Featured product">
    <!-- After -->
    <img src="slide-1.webp" fetchpriority="high" alt="Featured product">
    
  • Latência reduzida com o armazenamento em cache de borda. O armazenamento em cache é eficaz para reduzir os tempos de carregamento, mas no e-commerce ele tem um risco real: servir preços desatualizados e dados de inventário afeta diretamente a confiança do cliente e a receita. Monitoramos as métricas de negócios e os dados de performance, maximizando as taxas de ocorrência em cache e garantindo que nunca armazenássemos conteúdo que pudesse prejudicar a experiência do comerciante ou do comprador.

Impacto e resultados: melhoria de 57% a 96% no LCP

Métrica (janeiro de 2025 a janeiro de 2026) Melhoria relativa
LCP (boa) +68% (57% a 96%)
Core Web Vitals (taxa de aprovação) +50% (48% a 72%)
Taxa de conversão (sessão para pedido pago) — pesquisa orgânica do Google em dispositivos móveis +8,9%
Engajamento com o carrinho (sessão para carrinho): pesquisa orgânica do Google em dispositivos móveis +8,4%
Os valores representam a melhoria relativa ano a ano, com média nas operações regionais da Nuvemshop e da Tiendanube.

Essas melhorias posicionaram a Nuvemshop e a Tiendanube como a plataforma de e-commerce número 1 em desempenho no Brasil, na Argentina e no México.

Principais conclusões e reflexões pós-mortem

A arquitetura altamente personalizável da Nuvemshop não permitiu que usássemos manuais de otimização padrão. O problema real não era o peso da imagem ou a latência do servidor. Os navegadores estavam selecionando elementos inesperados como LCP devido a transições de CSS, falta de indicadores de prioridade e carregamento lento aplicado a imagens na parte superior da janela de visualização.

A correção foi simples depois que entendemos as causas principais: remover transições das seções de primeira posição, remover o carregamento lento das imagens na parte superior da janela de visualização e adicionar indicadores de prioridade explícitos. Aplicamos isso de forma consistente em todos os temas principais, tipos de página e mais de 180.000 lojas na nossa plataforma.

Os resultados falam por si mesmos: as taxas de aprovação do LCP passaram de 57% para 96%, as taxas gerais de aprovação das Core Web Vitals aumentaram de 48% para 72%, e as lojas tiveram ganhos mensuráveis: um aumento de 8,9% na taxa de conversão e de 8,4% no engajamento do carrinho em dispositivos móveis. As vitrines rápidas não são apenas uma conquista técnica, elas impulsionam diretamente o sucesso dos comerciantes.