Netwerkpaneel: Analyseer netwerkbelasting en bronnen

Dal St. Marthe
Dale St. Marthe
LinkedIn

Gebruik het netwerkpaneel om het laden van pagina's te analyseren en netwerkbronnen te inspecteren.

Overzicht

Met het Netwerkpaneel kunt u:

Bekijk Netwerkactiviteit inspecteren voor een begeleide tutorial waarin enkele van de meest gebruikte netwerkpaneelfuncties worden onderzocht.

Open het netwerkpaneel

Om het netwerkpaneel te openen, opent u DevTools en klikt u vervolgens op Netwerk in de actiebalk bovenaan.

U kunt ook deze stappen volgen om het netwerkpaneel te openen via het menu Commando :

  1. Open DevTools .
  2. Open het Commandomenu door op te drukken:
  3. macOS: Command + Shift + P
  4. Windows, Linux, ChromeOS: Control + Shift + P Commandomenu met
  5. Begin met het typen Network , selecteer Netwerkpaneel weergeven en druk op Enter .

Registreer netwerkactiviteit

Wanneer u DevTools opent , worden netwerkverzoeken automatisch vastgelegd in het netwerkpaneel , zolang DevTools geopend is.

Naast opnemen kunt u het volgende doen:

Netwerkverzoeken inspecteren

Alle netwerkverzoeken worden vastgelegd in de Verzoekentabel in het midden van het paneel.

Zie Een logboek met verzoeken bekijken voor meer informatie over de standaard weergegeven kolommen en de extra kolommen die u kunt toevoegen.

Klik op de naam van een verzoek om tabbladen weer te geven met aanvullende informatie over het verzoek, waaronder het volgende:

  • Headers : de HTTP-headers van de geselecteerde bron.
  • Payload : de parameters van de queryreeks en formuliergegevens van een aanvraag.
  • Preview : een basisweergave van de HTML.
  • Reactie : De HTML-broncode van de geselecteerde bron.
  • Initiator : Wat heeft ertoe geleid dat een resource is aangevraagd.
  • Timing : een overzicht van de netwerkactiviteit voor de geselecteerde bron.
  • Cookies : Cookies van een verzoek en het antwoord daarop.

Filter en sorteer netwerkverzoeken

In het paneel Netwerk kunt u op twee manieren verzoeken in de tabel Verzoeken sorteren:

Hieronder volgen verschillende manieren om verzoeken in de tabel Verzoeken te filteren:

Zie Netwerkheaders en -reacties zoeken voor meer informatie over het doorzoeken van de HTTP-headers en -reacties van alle bronnen op een bepaalde tekenreeks of reguliere expressie.

Wijzig het laadgedrag

Test de gebruikerservaring van uw pagina door het laadgedrag in het netwerkpaneel te wijzigen.

Met behulp van het netwerkpaneel kunt u het volgende doen:

Bewaar en exporteer netwerkverzoekgegevens

Zie het volgende om netwerkverzoekgegevens op te slaan en te exporteren: