O Monitor de Rede mostra todas as solicitações realizadas por uma página, o quanto a solicitação demorou, entre outros detalhes. Ao ir no menu "Ferramentas do Desenvolvedor Web" e clicar em "Rede" o monitor irá aparecer na parte de baixo da janela.
O Monitor de Rede irá mostrar as solicitações em uma tabela ao carregar uma página, cada requisição aparece em uma linha diferente:
A cada atualização, o monitor é limpo antes de mostrar as novas solicitções. Para modificar essa opção marque "Ativar logs persistentes" na Caixxa de Ferramentas.
Cada linha mostra:
Content-type da resposta;Ao clicar no nome de uma das colunas, as requisições são organizadas pela coluna selecionada.
A partir do Firefox 30, se o arquivo for uma imagem, a linha mostrá uma miniatura da imagem, e ao por o apontador sobre o nome poderá visualizá-la um pouco maior:
A lista de requisição também mostra a linha de tempo para diferentes partes de cada requisição. Cada linha de tempo é dada pela posição horizontal em cada linha relativa a outra requisição de rede, entaão você pode ver o tempo total levado para carregar a página. Para mais detalhes sobre a cor do código usado aqui, veja a sessão Tempos.
Na parte inferior da janela uma linha de botões lhe abilita a filtrar requisições pelo tipo de conteúdo da resposta:
Na extrema direita há um botão chamado "Limpar": como você pode imaginar, ele permite limpar a lista de requisições de rede.
Clique-direito em uma linha da lista exibe um menu de contexto com as seguintes opções:
Esta opção abre um editor e lhe abilita a editar o método, a URL e os parametros da requisição, editar os cabeçalhos, e reenviar a requisição.
Isto é novo no Firefox 31.
Esta opção copia a requisição de rede para a área de transferência como um comando cURL, de modo a você poder executá-lo em uma linha de comando. O comando pode incluir as seguintes opções:
-X [METHOD] |
Se o método não for GET ou POST |
--data |
Para parâmetros da requisição codificados para URL |
--data-binary |
Para parâmetros de requisição multipart |
--http/VERSION |
Se a versão HTTP não for 1.1 |
-I |
Se o método for HEAD |
-H |
Um para cada cabeçalho de requisição. Desde o Firefox 34, se o cabeçalho "Accept-Encoding" está presente, o comando cURL incluirá |
O clique em uma linha exibe um novo painel à direita do monitor de rede, que dá informações mais detalhadas sobre a requisição.
As abas no topo deste painel lhe permitem alternar entre cinco páginas diferentes:
Do Firefox 30 em diante, há uma sexta página que aparece se o tipo de conteúdo é HTML, a página Preview.
Um clique no ícone à esquerda das abas fecha o painel e retorna à visão de lista.
Esta aba lista informações básicas sobre a requisição incluindo URL e código de status, e também os cabeçalhos HTTP de requisição e resposta que foram enviados:
Você pode filtrar os cabeçalhos que são exibidos:
Esta aba lista detalhes completos de qualquer cookie enviado com a requisição ou a resposta:
Asim como os Headers, você pode filtrar a lista de cookies exibidos.
Esta aba exibe os parâmetros de GET e os dados de POST de uma requisição:
O conteúdo completo da resposta. Se a resposta é HTML, JS, ou CSS, ela será mostrada como texto:
Se a resposta for JSON, será exibida como um objeto inspecionável:
Se a resposta é uma imagem, a aba exibe uma amostra:
A aba Timings tem uma visão mais detalhada, anotada, da barra da linha do tempo para a requisição, mostrando a divisão do tempo total entre os vários estágios:
Este recurso é novo no Firefox 30.
Do Firefox 30 em diante, se o tipo de arquivo é HTML uma sexta aba aparece, rotulada de "Preview". Ela renderiza o HTML:
A ferramenta de análise de desempenho é nova no Firefox 29.
Do Firefox 29 em diante, o Monitor de Rede inclui uma ferramenta de análise de desempenho, para ajudar a lhe mostrar quanto tempo o navegador levou para descarregar as diferentes partes de seu sítio.
Para executar a ferramenta de análise de desempenho clique no ícone de cronômetro na barra de ferramentas, no rodapé do Monitor de Rede:
(Alternativamente, se você acabou de abrir o Monitor de Rede e ele ainda não está populado com a lista de requisições, você terá o ícone de cronômetro na janela principal.)
O Monitor de Rede, então, carrega o sítio duas vezes: uma com o cache do navegador vazio e outra com o cache já preparado. Isto simula a primeira visita de um usuário ao seu sítio, e as visitas subsequentes. Ele exibe os resultados de cada execução lado a lado ou verticalmente, se a janela for estreita:
Os resultados de cada execução são sumarizados em uma tabela e em um gráfico de pizza. A tabela agrupa os recursos por tipo, e mostra o tamanho total de cada recurso e o tempo total que ele levou para carregá-los. O gráfico de pizza mostra o tamanho relativo de cada tipo de recurso.
Para voltar à lista de requisições de rede do Monitor de Rede clique no botão "Back" à esquerda.
Clicar em uma fatia da pizza leva você ao Monitor de Rede daquela execução, com um filtro automaticamente aplicado para ver só aquele tipo de recurso.