10 dicas para acelerar sua loja Shopify
Cada segundo a mais no carregamento custa vendas. Pesquisas da Google mostram que 53% dos visitantes mobile abandonam uma página que demora mais de 3 segundos para carregar. No Shopify, onde mais de 70% do tráfego vem do celular, velocidade é dinheiro.
O Shopify já é rápido por padrão. A infraestrutura usa CDN global, HTTP/2 e compressão automática. Mas as escolhas que você faz ao montar a loja podem travar tudo: apps demais, imagens pesadas, fontes desnecessárias, scripts de terceiros.
Neste artigo, 10 dicas práticas para melhorar a velocidade da sua loja sem precisar de desenvolvedor.
Neste artigo
- 1. Otimize as imagens
- 2. Reduza os apps instalados
- 3. Use fontes do sistema
- 4. Prefira apps baseados em metafields
- 5. Minimize scripts de terceiros
- 6. Use lazy loading nas imagens
- 7. Simplifique a homepage
- 8. Revise o código do tema
- 9. Monitore com o relatório de velocidade
- 10. Cuidado com sliders e carrosséis
- Perguntas frequentes
- Leitura complementar
1. Otimize as imagens
Imagens são o fator número 1 de lentidão na maioria das lojas Shopify. Uma foto de produto de 5 MB carrega em 1 segundo numa conexão Wi-Fi rápida, mas leva 8 segundos no 4G. Multiplique por 20 fotos na galeria e o resultado é uma página que ninguém espera carregar.
O Shopify comprime e converte imagens automaticamente para WebP, mas você precisa fazer a sua parte. Suba imagens com no máximo 2048×2048 pixels. Use formato JPEG ou PNG. Evite imagens com mais de 1 MB antes do upload.
Para produtos com muitas variantes, a galeria pode ficar pesada. Usar um app que filtra a galeria por variante selecionada ajuda: em vez de carregar 20 fotos, o cliente vê apenas as 4 da variante ativa.
2. Reduza os apps instalados
Cada app instalado pode adicionar JavaScript e CSS à sua loja. Alguns adicionam pouco. Outros carregam bibliotecas inteiras que pesam centenas de kilobytes. O problema se acumula: 15 apps podem adicionar 2 MB de scripts.
Faça uma auditoria. Vá em Configurações > Apps e canais de vendas. Desinstale o que não está usando. E atenção: desativar um app nem sempre remove o código dele do tema. Verifique se os snippets foram removidos após desinstalar.
3. Use fontes do sistema
Fontes customizadas (Google Fonts, Adobe Fonts) adicionam 100-400 KB ao carregamento. O navegador precisa baixar os arquivos de fonte antes de renderizar o texto. Isso causa o “flash” de texto invisível que você às vezes vê ao abrir uma página.
Fontes do sistema (Arial, Helvetica, Georgia, system-ui) não precisam de download. Estão no dispositivo do cliente. A diferença visual é mínima, mas o ganho de velocidade é perceptível.
Se a fonte customizada faz parte da identidade da marca, mantenha. Mas se você escolheu uma fonte genérica do Google Fonts só porque “parecia bonita”, considere trocar por uma do sistema.
4. Prefira apps baseados em metafields
Apps que armazenam dados em metafields do Shopify são mais rápidos que apps que dependem de servidores externos. O motivo: metafields carregam junto com a página, no mesmo request. Apps com servidor externo precisam de uma chamada de API separada, que adiciona latência.
O Rubik Variant Images é um exemplo: salva a relação entre variantes e imagens em metafields. Quando a página carrega, os dados já estão ali. Sem delay, sem loading spinner.
Na hora de escolher apps, pergunte: “Esse app precisa buscar dados de um servidor externo a cada pageview?” Se sim, considere alternativas baseadas em metafields.
5. Minimize scripts de terceiros
Chat ao vivo, pop-ups, pixels de remarketing, widgets de avaliação. Cada um carrega um script externo. Alguns carregam vários. O Facebook Pixel, o Google Analytics 4 e o TikTok Pixel juntos adicionam 200-300 KB.
Não dá para eliminar todos. Mas você pode priorizar. O que realmente gera retorno? O chat ao vivo que ninguém usa pode sair. O pop-up que aparece nos primeiros 3 segundos pode ser adiado. Pixels de redes que você não anuncia podem ser removidos.
6. Use lazy loading nas imagens
Lazy loading faz com que imagens abaixo da dobra (a parte da página que não aparece na primeira tela) só carreguem quando o cliente rola até elas. Isso reduz o tempo de carregamento inicial.
A maioria dos temas modernos do Shopify já usa lazy loading. Verifique se o seu tema tem essa funcionalidade ativada. Se não tiver, temas oficiais como Dawn, Refresh e Craft já vêm com lazy loading habilitado.
7. Simplifique a homepage
A homepage é a página mais pesada na maioria das lojas. Seções de destaque, coleções em destaque, banner em vídeo, depoimentos, Instagram feed. Cada seção adiciona imagens e scripts.
Pergunte: todas essas seções convertem? Se o banner em vídeo de 10 MB não gera cliques, substitua por uma imagem estática. Se a seção de Instagram feed carrega um widget externo pesado, considere usar imagens estáticas no lugar.
8. Revise o código do tema
Se você contratou alguém para customizar o tema, verifique se o código adicionado é eficiente. CSS e JavaScript desnecessários acumulam. Seções que foram desativadas no editor de temas mas cujo código permanece no Liquid continuam carregando.
Uma revisão anual do código do tema pode revelar centenas de linhas que não fazem mais nada. Remova o que não é usado.
9. Monitore com o relatório de velocidade
O Shopify tem um relatório de velocidade nativo em Loja Online > Velocidade. Ele mostra a pontuação da sua loja baseada no Google Lighthouse e compara com lojas similares.
Use esse relatório regularmente. Depois de instalar um novo app, verifique se a pontuação caiu. Depois de remover seções da homepage, veja se melhorou. O relatório não é perfeito (a pontuação varia entre medições), mas mostra tendências ao longo do tempo.
10. Cuidado com sliders e carrosséis
Sliders de imagem (carrosséis) são populares, mas pesados. Cada slide carrega uma imagem em alta resolução. A biblioteca JavaScript do slider adiciona peso. E estudos de UX mostram que poucos clientes passam do segundo slide.
Se possível, substitua o slider por uma imagem estática de destaque ou por uma grade de imagens. Se precisar manter o slider, limite a 3 slides e use imagens otimizadas.
O mesmo vale para a galeria de imagens do produto. Uma galeria com 20 fotos de todas as variantes é pesada. Configurar imagens por variante com filtragem reduz a quantidade de fotos visíveis e melhora a experiência.
Perguntas frequentes
Qual a pontuação ideal de velocidade no Shopify?
Uma pontuação acima de 50 no relatório do Shopify é considerada boa. Acima de 70, excelente. Lojas com muitos apps e seções pesadas costumam ficar entre 30 e 50. O importante é a tendência: se a pontuação cai depois de uma mudança, investigue.
Apps de imagens de variantes deixam a loja mais lenta?
Depende do app. Apps baseados em metafields (como o Rubik Variant Images) não adicionam latência perceptível. Apps que dependem de servidores externos para carregar dados a cada pageview podem impactar a velocidade.
Desinstalar um app remove todo o código dele?
Nem sempre. Alguns apps adicionam snippets de código Liquid ao tema que não são removidos automaticamente. Após desinstalar, verifique o código do tema e remova snippets órfãos.
O formato WebP é melhor que JPEG para imagens de produto?
Sim, WebP oferece compressão melhor com qualidade similar. O Shopify converte automaticamente para WebP quando o navegador suporta. Você não precisa fazer nada: suba em JPEG ou PNG e o Shopify cuida do resto.
Quantos apps posso ter instalados sem afetar a velocidade?
Não existe um número mágico. O impacto depende de como cada app funciona. Um app bem feito que usa metafields pode ter impacto zero. Um app mal otimizado sozinho pode derrubar a pontuação. Avalie cada app individualmente.
Lazy loading afeta o SEO das imagens?
Não, quando implementado corretamente. O Google reconhece lazy loading e ainda indexa as imagens. Os temas oficiais do Shopify implementam lazy loading de forma compatível com SEO.
Vale a pena pagar por um app de otimização de velocidade?
Na maioria dos casos, não. As 10 dicas deste artigo cobrem 90% dos problemas de velocidade. Apps de otimização podem ajudar em casos específicos, mas primeiro faça o básico: otimize imagens, reduza apps e minimize scripts de terceiros.
Leitura complementar
