Configurações do Painel Network do Chrome DevTools para o Core Web Vitals
As configurações do painel Network que utilizo em cada auditoria de Core Web Vitals
O painel Network do Chrome DevTools é uma das ferramentas mais úteis para a depuração do Core Web Vitals. Mas as configurações padrão ocultam metade das informações de que você precisa. Veja como configuro o painel Network em todas as auditorias.
Última revisão por Arjen Karel em março de 2026
Table of Contents!
Configurando o Painel Network
Para acessar o painel Network, abra o Chrome DevTools (F12 ou Ctrl+Shift+I) e clique na guia "Network".
Throttling
Seus visitantes não estão no Wi-Fi do seu escritório. Globalmente, 30% das conexões móveis ainda são 3G e outras 55% são 4G (GSMA Mobile Economy 2025). O throttling de rede permite que você veja o que eles veem.
Clique no menu suspenso "No throttling" no painel Network. Selecione "Fast 4G", "Slow 4G" ou "3G" para simular as condições da rede móvel. A melhor opção depende do seu público. Se o seu público geralmente utiliza dispositivos móveis de alta tecnologia sob condições de rede rápidas, ative "Fast 4G". Se as condições típicas da rede forem um pouco piores, selecione "Slow 4G". Caso contrário, jogue pelo seguro e selecione "3G".
Throttling em solicitações individuais (Chrome 145+)
Desde dezembro de 2025, você pode aplicar throttling em uma única solicitação em vez da página inteira. Clique com o botão direito do mouse em qualquer solicitação no painel Network e selecione "Throttle request". Isso permite responder a perguntas como: o que acontece com meu LCP se esse script de terceiros carregar lentamente? Ou: como minha página se comporta quando a CDN está lenta, mas a conexão do usuário é rápida? É a maneira mais rápida de isolar o impacto no desempenho de um único recurso.
Desativar o Cache
Para garantir que você está testando seu site como um visitante de primeira viagem o experienciaria, marque a caixa de seleção "Disable cache" no painel Network.
Ativar o Big Request Rows
O Big request rows mostra detalhes críticos que a visualização compacta padrão oculta:
- A coluna size mostra tanto o tamanho compactado (transferência) quanto o tamanho não compactado (real) de cada solicitação.
- A coluna name mostra o caminho completo, não apenas o nome do arquivo.
- A coluna priority mostra o fetch priority inicial e final. É assim que você verifica se sua imagem de LCP carrega com prioridade High ou identifica quando o Chrome re-prioriza um recurso.
Ativar Screenshots
Ative os screenshots e o Chrome captura uma tira de filme de cada alteração visual durante o carregamento da página. É assim que você identifica layout shifts e verifica se o seu elemento de LCP é renderizado quando você espera.
- Com a guia Network em foco, pressione Ctrl+F5 (Cmd+R no Mac) para atualizar a página.
- O Chrome capturará screenshots durante o processo de carregamento da página.
- Miniaturas desses screenshots aparecerão abaixo da linha de caixas de seleção no painel Network.
A visão geral dos screenshots tem alguns recursos pequenos e úteis que você talvez ainda não conheça:
- Passe o mouse sobre um screenshot para ver quando ele foi capturado. Isso será indicado por uma linha vertical amarela no gráfico de visão geral.
- Clique em uma miniatura de screenshot para filtrar as solicitações que ocorreram após a captura daquele screenshot.
- Clique duas vezes em uma miniatura para aumentar o zoom e visualizar o screenshot com mais detalhes.
Ativar as melhores colunas do Network
As colunas padrão omitem dados críticos. Clique com o botão direito em qualquer cabeçalho de coluna para adicionar mais. Estas são as que eu ativo em cada auditoria:
| Nome da Coluna | Descrição | Por que é importante para o Core Web Vitals |
|---|---|---|
| Name | Nome da solicitação | Identifica todos os recursos que o navegador baixa |
| Status | Códigos de status HTTP | Identifica redirecionamentos (301, 302) que adicionam latência ao seu TTFB e erros 404 para recursos que desperdiçam uma ida e volta na rede |
| Protocol | Protocolo de rede utilizado | O HTTP/3 elimina o bloqueio head-of-line. De acordo com o Cloudflare Radar, apenas 21% das solicitações utilizam HTTP/3. Se a sua CDN oferece suporte a ele e você não vê h3 nesta coluna, verifique sua configuração de DNS |
| Domain | Domínio do recurso | Separa solicitações primárias (first-party) de solicitações de terceiros (third-party). O Web Almanac 2024 descobriu que 92% das páginas carregam pelo menos um recurso de terceiros. Ordenar por domínio revela quanto do seu waterfall está fora do seu controle |
| Type | Tipo do recurso | Filtre por tipo para isolar scripts, imagens ou fontes competindo por largura de banda |
| Initiator | Gatilho da solicitação | Descubra qual script ou folha de estilo acionou cada solicitação. É assim que você rastreia uma cadeia lenta de solicitações críticas de volta à sua origem |
| Size | Tamanho de transferência e tamanho real | Identifica recursos não compactados ou superdimensionados. A página móvel mediana carrega 66 solicitações, totalizando 2,3 MB (Web Almanac 2024) |
| Priority | Prioridade de carregamento do recurso | Mostra o fetch priority inicial e final. Verifique se a sua imagem de LCP carrega como High e se os scripts não críticos carregam como Low |
| Waterfall | Linha do tempo visual das solicitações | A linha do tempo que mostra onde o tempo é gasto. Barras longas antes da primeira renderização afetam diretamente o seu LCP e o FCP |
Ativar cabeçalhos de resposta personalizados
| Nome da Coluna | Descrição | Por que é importante para o Core Web Vitals |
|---|---|---|
| Cache-Control | Comportamento de cache do recurso | Verifique se os ativos estáticos têm longos tempos de vida útil em cache e se o HTML tem a revalidação apropriada. Um cache deficiente força visitantes recorrentes a baixar os recursos novamente, prejudicando todas as métricas. Veja também: configuração de cache da Cloudflare |
| Link | Cabeçalho de resposta Link | Verifique se o seu servidor envia dicas de preload ou preconnect, inclusive via 103 Early Hints |
| Content-Encoding | A codificação utilizada | Verifique se o seu servidor envia Brotli (br) em vez de gzip. O Brotli compacta o JavaScript de 15 a 20% menor que o gzip. O Web Almanac 2024 mostra que o Brotli ultrapassou o gzip em recursos JavaScript (45% vs 41%) |
Se você quiser analisar cabeçalhos de resposta em massa sem abrir o DevTools para cada página, experimente o HTTP Header Performance Analyzer.
Conectar ao painel Performance
O painel Network mostra o que carrega e quando. Para ver como cada recurso afeta o Core Web Vitals, mude para o painel Performance. Agora ele mostra as pontuações de LCP, CLS e INP ao vivo sem gravar e pode sobrepor dados de campo do CrUX de usuários reais. Utilize o painel Network para diagnosticar e o painel Performance para confirmar.
Para um monitoramento contínuo além de uma única sessão de depuração, conecte uma ferramenta de Real User Monitoring para poder rastrear se as suas correções do painel Network realmente melhoram os dados de campo ao longo do tempo.
A configuração completa
Recarregue a página com essas configurações e o seu painel Network ficará assim. Cada coluna mapeia algo que afeta o Core Web Vitals.
Find out what is actually slow.
I map your critical rendering path using real field data. You get a prioritized fix list, not a Lighthouse report.
Get the audit
