Diagnóstico de desempenho de sites
Antes de alterar o site, reproduza o problema e observe em que etapa aparece. Diagnósticos ajudam a separar sintomas e escolher uma correção que possa ser conferida.
Escolha seu próximo passo
58 GUIAS DISPONÍVEISComo diagnosticar um site lento
Reproduza a lentidão e investigue servidor, recursos, scripts e interação antes de escolher uma otimização.
Ler o guia GUIA PRÁTICOComo corrigir mudanças de layout medidas pelo CLS
Localize elementos que deslocam o conteúdo durante a leitura e escolha correções como reservar espaço e ajustar fontes com base em medições.
Ler o guia GUIA PRÁTICOComo reduzir JavaScript desnecessário
Use medições para localizar código que a página não precisa e reduza carregamento sem remover interações ou recursos importantes.
Ler o guia GUIA PRÁTICOComo identificar CSS que bloqueia a renderização
Analise a cadeia de recursos que antecede a primeira renderização e reduza estilos críticos com testes visuais e responsivos.
Ler o guia GUIA PRÁTICOComo otimizar o carregamento de fontes
Reduza fontes e variantes dispensáveis, escolha um fallback compatível e use preload somente quando medições mostrarem que ajuda.
Ler o guia GUIA PRÁTICOComo medir o tempo de resposta do servidor
Separe DNS, conexão, TLS, espera pelo primeiro byte e download para localizar atrasos entre navegador e servidor.
Ler o guia GUIA PRÁTICOComo avaliar se um site precisa de CDN
Avalie distância, conteúdo estático, tráfego, cache e custos para saber se uma CDN atende a um problema medido.
Ler o guia GUIA PRÁTICOComo reduzir o impacto de scripts de terceiros
Inventarie tags, iframes e widgets externos, confirme seu valor e adie ou remova o que não é necessário.
Ler o guia GUIA PRÁTICOComo investigar lentidão no painel do WordPress
Reproduza a lentidão por tarefa e avalie plugins, consultas, servidor e tarefas em segundo plano antes de trocar de hospedagem.
Ler o guia GUIA PRÁTICOComo interpretar um relatório do PageSpeed Insights
Leia separadamente dados de campo e diagnóstico de laboratório, localize métricas e oportunidades relevantes e priorize uma hipótese que possa ser testada.
Ler o guia GUIA PRÁTICOLargest Contentful Paint: como medir e investigar o LCP
Identifique o maior conteúdo visível, meça o LCP em campo e laboratório e investigue servidor, descoberta do recurso e renderização. Compare condições equivalentes antes e depois.
Ler o guia GUIA PRÁTICOInteraction to Next Paint: como diagnosticar o INP do site
Investigue interações lentas observando entrada, processamento e apresentação visual. Reproduza tarefas representativas e diferencie uma medição local dos dados de usuários reais.
Ler o guia GUIA PRÁTICOCache de páginas no WordPress: configuração e verificação
Entenda quando o cache de página ajuda, escolha uma configuração compatível com a hospedagem e teste páginas dinâmicas, usuários conectados, formulários e atualizações.
Ler o guia GUIA PRÁTICOQuery Monitor: como investigar consultas lentas no WordPress
Use o Query Monitor em ambiente controlado para encontrar consultas e componentes associados à lentidão. Restrinja o acesso aos diagnósticos e confirme cada hipótese antes de otimizar.
Ler o guia GUIA PRÁTICOComo monitorar Core Web Vitals após mudanças no site
Registre as páginas e mudanças importantes, combine monitoramento de campo e testes reproduzíveis e investigue regressões depois de atualizações ou publicação.
Ler o guia GUIA PRÁTICOComo configurar o Cloudflare e verificar DNS e HTTPS
Revise registros DNS, proxy, SSL/TLS e cache sem afetar email, painel administrativo ou conteúdo dinâmico. Teste cada host após a mudança.
Ler o guia GUIA PRÁTICOComo configurar e limpar o cache do Cloudflare
Defina regras de cache compatíveis com o site e purgue apenas o conteúdo necessário, verificando HTML, mídia e recursos atualizados.
Ler o guia GUIA PRÁTICOComo encontrar o elemento LCP no Lighthouse
Descubra qual conteúdo grande foi pintado por último antes de decidir o que otimizar.
Ler o guia GUIA PRÁTICOComo priorizar o recurso que causa LCP lento
Descubra se o atraso está no servidor, descoberta do recurso, transferência ou renderização.
Ler o guia GUIA PRÁTICOComo reduzir downloads que não contribuem para a página
Remova recursos e scripts sem uso na rota para liberar rede e processamento.
Ler o guia GUIA PRÁTICOQuando usar lazy loading em imagens do site
Adie mídia distante da primeira tela e evite atrasar o elemento principal do carregamento.
Ler o guia GUIA PRÁTICOComo reservar espaço para imagens e reduzir CLS
Informe as dimensões da mídia para o navegador não deslocar o conteúdo quando ela carregar.
Ler o guia GUIA PRÁTICOComo pré-carregar a imagem LCP sem competir com outros recursos
Use preload apenas quando a imagem essencial é descoberta tarde pelo navegador.
Ler o guia GUIA PRÁTICOComo evitar excesso de preload em uma página
Priorize poucos recursos comprovadamente críticos, não toda biblioteca ou mídia acima da dobra.
Ler o guia GUIA PRÁTICOComo revisar fontes web que atrasam texto visível
O texto pode ser elemento LCP; revise download, prioridade e estratégia de fallback da fonte.
Ler o guia GUIA PRÁTICOComo manter texto legível enquanto uma webfont carrega
Escolha comportamento da fonte que preserve leitura e limite mudanças bruscas de layout.
Ler o guia GUIA PRÁTICOComo reduzir CLS causado pela troca de fonte
Investigue deslocamentos quando fontes e conteúdo final entram depois da renderização inicial.
Ler o guia GUIA PRÁTICOComo decidir se uma fonte deve receber preload
Pré-carregue somente a fonte usada cedo e que demonstrou atraso no recurso de texto principal.
Ler o guia GUIA PRÁTICOLighthouse e dados de campo: quando usar cada um
Use laboratório para reproduzir e dados de campo para entender experiências reais.
Ler o guia GUIA PRÁTICOPor que CLS de campo difere do Lighthouse
Deslocamentos depois do carregamento inicial podem aparecer para usuários e escapar ao teste rápido.
Ler o guia GUIA PRÁTICOComo usar TTFB e FCP para investigar LCP alto
Localize se o atraso está antes dos primeiros bytes, do conteúdo inicial ou do elemento principal.
Ler o guia GUIA PRÁTICOTBT e INP: como interpretar sem confundir as métricas
TBT é diagnóstico de laboratório; INP mede responsividade observada durante interações reais.
Ler o guia GUIA PRÁTICOComo investigar tarefas longas que atrasam cliques
Inspecione trabalho de JavaScript e divida operações que deixam a interface sem resposta.
Ler o guia GUIA PRÁTICOComo carregar recursos sob demanda sem prejudicar interações
Evite baixar componentes e bibliotecas que o visitante não usa nessa página.
Ler o guia GUIA PRÁTICOComo validar lazy loading em rede lenta
Teste mídia próxima à viewport e confirme que aparece a tempo sem carregar tudo no início.
Ler o guia GUIA PRÁTICOComo validar uma otimização de Core Web Vitals após publicar
Compare antes e depois com mesmo escopo e monitore se o ganho de laboratório se confirma em campo.
Ler o guia GUIA PRÁTICOComo usar srcset com descritores de largura
Ofereça tamanhos diferentes para que o navegador selecione um arquivo adequado à tela e ao layout.
Ler o guia GUIA PRÁTICOComo configurar sizes para imagens responsivas
Descreva ao navegador quanto espaço a imagem ocupa antes que o arquivo seja escolhido.
Ler o guia GUIA PRÁTICOComo servir imagens nítidas em telas de alta densidade
Forneça versões adequadas a telas de 2x sem enviar arquivos enormes a todo dispositivo.
Ler o guia GUIA PRÁTICOQuando usar picture para selecionar outra imagem
Use `<picture>` quando a composição ou o recorte precisa mudar entre contextos, não apenas o tamanho.
Ler o guia GUIA PRÁTICOComo planejar art direction de imagens para mobile
Mude o enquadramento em telas menores quando a composição desktop não comunica bem o conteúdo.
Ler o guia GUIA PRÁTICOComo adicionar fallback src ao elemento picture
Preserve uma fonte de imagem padrão para navegadores e rastreadores que não usem as fontes condicionais.
Ler o guia GUIA PRÁTICOComo escolher formato de imagem para um site
Compare tipo de conteúdo, transparência, qualidade percebida e suporte antes de converter arquivos.
Ler o guia GUIA PRÁTICOAVIF, WebP ou JPEG: como comparar formatos de foto
Avalie compressão e aparência no conteúdo real antes de trocar o formato das fotos.
Ler o guia GUIA PRÁTICOQuando usar SVG em vez de imagem raster
Use vetor para logos e gráficos de formas; mantenha raster para conteúdo fotográfico quando fizer sentido.
Ler o guia GUIA PRÁTICOComo redimensionar imagens para o tamanho de exibição
Evite baixar uma imagem muito maior do que o espaço que ela ocupa na página.
Ler o guia GUIA PRÁTICOComo comprimir imagens sem prejudicar o conteúdo
Reduza bytes com uma rotina de comparação visual para cada tipo de imagem.
Ler o guia GUIA PRÁTICOComo automatizar a otimização de imagens na publicação
Inclua conversão e geração de tamanhos como etapa repetível do fluxo de conteúdo.
Ler o guia GUIA PRÁTICOComo usar uma CDN para transformar imagens do site
Avalie se uma CDN de imagens resolve a entrega de tamanhos e formatos sem perder controle dos ativos.
Ler o guia GUIA PRÁTICOCDN de imagens ou otimização no build: como escolher
Compare transformação em runtime com geração de arquivos otimizados durante o build.
Ler o guia GUIA PRÁTICOComo testar qual imagem responsiva o navegador baixou
Confira no painel de rede qual candidato foi requisitado em cada viewport e densidade.
Ler o guia GUIA PRÁTICOComo encontrar imagens pesadas em uma página
Identifique arquivos que consomem mais transferência antes de alterar o design ou instalar ferramentas.
Ler o guia GUIA PRÁTICOComo revisar imagens visíveis na primeira tela
Priorize clareza e carregamento da mídia principal sem transferir imagens desnecessárias no início.
Ler o guia GUIA PRÁTICOComo testar se o conteúdo reorganiza com zoom
Confira se a página continua utilizável em coluna estreita sem rolagem horizontal geral.
Ler o guia GUIA PRÁTICOComo verificar se texto ampliado continua utilizável
Teste aumento do texto sem sobreposição, corte ou perda de controles.
Ler o guia GUIA PRÁTICOComo testar o espaçamento de texto de uma página
Verifique se mudanças de espaçamento não sobrepõem ou cortam o conteúdo.
Ler o guia GUIA PRÁTICOComo conferir contraste de botões, bordas e estados
Revise controles e indicadores além do contraste do texto corrido.
Ler o guia GUIA PRÁTICOComo reduzir animações disparadas por interação
Evite movimento inesperado em transições acionadas por clique ou rolagem.
Ler o guiaPrecisa colocar em prática?
Conheça o escopo do serviço, as responsabilidades e os critérios para conferir a entrega.
Conhecer o serviço