Painel Network: analisar a carga e os recursos da rede

Dale St. Marthe
Dale St. Marthe

Use o painel Network para analisar a carga da página e inspecionar os recursos de rede.

Visão geral

No painel Rede, você pode:

Confira Inspecionar atividade de rede para conferir um tutorial guiado que mostra alguns dos recursos mais usados do painel Rede.

Abrir o painel "Rede"

Para abrir o painel Rede, abra as Ferramentas do desenvolvedor e clique em Rede na barra de ação na parte de cima.

Como alternativa, para abrir o painel Rede pelo menu de comando, siga estas etapas:

  1. Abra o DevTools.
  2. Abra o menu de comando pressionando:
  3. macOS: Command+Shift+P
  4. Windows, Linux e ChromeOS: Control+Shift+P Menu de comando com
  5. Comece a digitar Network, selecione Mostrar painel de rede e pressione Enter.

Gravar atividade de rede

Quando você abre o DevTools, as solicitações de rede são gravadas automaticamente no painel Network, desde que o DevTools esteja aberto.

Além de gravar, você pode fazer o seguinte:

Inspecionar solicitações de rede

Todas as solicitações de rede são registradas na tabela Solicitações, no centro do painel.

Para saber mais sobre as colunas exibidas por padrão e outras que você pode adicionar, consulte Consultar um registro de solicitações.

Clique no nome de uma solicitação para ver guias com mais informações, incluindo:

  • Cabeçalhos: os cabeçalhos HTTP do recurso selecionado.
  • Payload: os parâmetros da string de consulta e os dados do formulário de uma solicitação.
  • Visualização: uma renderização básica do HTML.
  • Resposta: o código-fonte HTML do recurso selecionado.
  • Iniciador: o que causou a solicitação de um recurso.
  • Tempo: um detalhamento da atividade de rede do recurso selecionado.
  • Cookies: cookies de uma solicitação e da resposta dela.

Filtrar e classificar solicitações de rede

O painel Rede oferece duas maneiras de classificar as solicitações na tabela Solicitações:

Confira a seguir várias maneiras de filtrar solicitações na tabela Solicitações:

Para saber como pesquisar cabeçalhos e respostas HTTP de todos os recursos para uma determinada string ou expressão regular, consulte Pesquisar cabeçalhos e respostas da rede.

Mudar o comportamento de carregamento

Teste a experiência do usuário na sua página mudando o comportamento de carregamento no painel Rede.

Usando o painel Rede, você pode:

Salvar e exportar dados de solicitações de rede

Para salvar e exportar dados de solicitação de rede, consulte: