01
Carregamento: LCP
Conteúdo principal, hero e imagens prioritários. O limiar bom de LCP é 2,5 segundos ou menos.
Performance Shopify.
Menos fricção. Mais loja.
Um bom score ajuda. Uma loja rápida e utilizável é o objetivo. Diagnosticamos Shopify, otimizamos código e assets e mantemos a experiência de marca. In-house, com CRO no briefing.
Liquid / HTML
—
Hero media
—
Theme CSS
—
Cart module
—
App embeds
—
Peso da página
Encontra o bloqueio. Resolve a causa certa.
Páginas e dispositivos que importam na compra. Core Web Vitals, testes e dados reais para escolher melhorias úteis.
02
Interação: INP
Tarefas e scripts de filtros, variantes, menus e carrinho. INP bom: 200 milissegundos ou menos.
03
Estabilidade: CLS
Espaço reservado a media, fontes e UI. CLS bom: 0,1 ou menos. Limiares avaliados no percentil 75 das visitas.
04
A pegada de terceiros
Embeds, trackers duplicados e código sem uso. Mantemos o valor e substituímos as dependências adequadas.
Um plano claro. Uma equipa que executa.
Diagnóstico priorizado, melhorias implementadas e medição clara, definidos sobre a loja e os seus limites.
Analisar a loja
Templates, rede, scripts, testes e dados reais disponíveis para encontrar as causas.
Implementar prioridades
Assets críticos, rendering, execução e apps com validação funcional.
Medir e manter
Rever percursos, acompanhar dados reais e definir um orçamento para futuras alterações.
Um orçamento de performance antes da urgência
Ajusta peso dos assets e ligação. A fórmula de transferência cria uma referência; navegador e dados reais validam a experiência.
Tempo de transferência
Build atual2,400 KB
Build otimizada840 KB
- Peso de página removido
- 65%
- Peso da página
- 840 KB
A solução está no código
Media dimensionada, código quando necessário e layouts estáveis. Explora a implementação.
hero.liquid
{{ section.settings.image
| image_url: width: 1800
| image_tag:
widths: '480, 750, 1100, 1800',
sizes: '(max-width: 749px) 100vw, 50vw',
loading: 'eager',
fetchpriority: 'high'
}}feature-loader.js
const observer = new IntersectionObserver(
([entry], observer) => {
if (!entry.isIntersecting) return;
import('./cart-drawer.js');
observer.disconnect();
}, { rootMargin: '200px' }
);
observer.observe(cartTrigger);product-media.css
.product-media {
aspect-ratio: 4 / 5;
overflow: hidden;
}
.product-media img {
width: 100%;
height: 100%;
object-fit: cover;
}Medir percursos representativos
Coleção, produto e carrinho em mobile e desktop nas mesmas condições antes e depois.
Proteger a compra
HTML no servidor, media dimensionada e carregamento diferido do secundário, mantendo marca e funções.
Evitar regressões
Medição e releases repetíveis para campanhas, alterações e apps.
Mais produto. Mais fácil de encontrar
A home tem um objetivo claro: mostrar o catálogo e levar as pessoas a explorar. Grids alternáveis reúnem New in, Best sellers e categorias-chave na mesma página. Rendering leve e media a pedido permitem mostrar mais sem carregar tudo de uma vez.
Vê como o construímosDesenhado e desenvolvido pela Black Comet.
Vamos falar da próxima etapa.
Conta-nos onde estás, o que te trava e onde queres chegar. Definimos juntos o próximo passo.
O resto do teu growth engine
Antes de começarmos
Garantem 100 no PageSpeed?
Os objetivos seguem a auditoria. Scores variam com conteúdo, apps, dispositivos e rede. Verificamos velocidade e estabilidade com medições comparáveis.
Qual a diferença entre laboratório e dados reais?
Testes controlados ajudam diagnóstico e releases. Dados reais refletem visitas e condições diversas. Usamos ambos.
Removem vídeos ou design?
Primeiro otimizamos a entrega de assets e funções. Compromissos de design são avaliados com a equipa.
As apps podem tornar Shopify lento?
Podem contribuir. A auditoria identifica as fontes. Algumas apps são úteis; certas funções podem viver no tema.
Continuam depois do projeto?
Sim, com ecommerce management e desenvolvimento contínuo, revendo novos assets, funções e apps.