0

HAR-bestandswatervalanalysator

Upload een .har-bestand dat is geëxporteerd vanuit de DevTools van uw browser om een echte verzoekwaterval te zien die is opgebouwd uit de eigen timinggegevens van elk verzoek, plus controles op ontbrekende cacheheaders, niet-gecomprimeerde antwoorden en scripts die het renderen blokkeren.

Sleep het bestand hierheen of klik om te bladeren

Exporteer een HAR-bestand vanuit het tabblad DevTools → Netwerk van uw browser (klik met de rechtermuisknop op de lijst met verzoeken → "Alles opslaan als HAR met inhoud") en zet het hier neer. Alles wordt lokaal geparseerd en weergegeven; het bestand wordt nooit ergens geüpload.

Buy Me a Coffee at ko-fi.com
Verwerken... 0%
HAR-bestand parseren
Waterval bouwen
Het analyseren van verzoeken
Klaar

Resultaat

Een HAR-bestand (HTTP Archive) is een JSON-export van alles wat het DevTools Network-paneel van een browser heeft vastgelegd tijdens het laden van een pagina: elke verzoek- en antwoordheader, de exacte grootte en MIME-type van elke antwoordtekst, en een uitsplitsing van de timing per verzoek. U kunt er een maken vanuit Chrome, Firefox, Edge of Safari door DevTools te openen, de pagina op het tabblad Netwerk opnieuw te laden, vervolgens met de rechtermuisknop op de verzoekenlijst te klikken en 'Alles opslaan als HAR met inhoud' te kiezen. Deze tool leest het geëxporteerde bestand rechtstreeks; er wordt niets opnieuw opgehaald of opnieuw opgevraagd.

Het watervaldiagram is volledig opgebouwd uit gegevens die zich al in het bestand bevinden: het eigen timingobject van elk item verdeelt een verzoek in geblokkeerde, DNS-zoekopdracht, verbinding, SSL/TLS-onderhandeling, verzenden, wachten (tijd tot eerste byte) en ontvangen, en elke fase wordt getekend als zijn eigen gekleurde segment. Volgens de HAR-specificatie wordt de SSL-tijd ook opgenomen in connect, dus deze wordt eerst afgetrokken - anders zou het TLS-gedeelte tweemaal worden geteld en zouden de staafbreedtes niet langer optellen tot de werkelijke duur van het verzoek. Gestreepte verticale markeringen tonen DOMContentLoaded en Load, rechtstreeks afgelezen van de eigen paginatiming van het bestand, zodat u precies kunt zien welke verzoeken zijn voltooid voordat de pagina interactief werd.

Naast het diagram voert de tool drie zoekregels uit over velden die al in het HAR-formaat zijn vastgelegd. Het markeert cachebare antwoorden (status 200, 203 of 206) die noch een Cache-Control, noch een Expires-header bevatten, wat betekent dat een herhaald bezoek ze helemaal opnieuw moet downloaden. Het markeert tekstuele reacties (HTML, CSS, JavaScript, JSON, SVG en dergelijke) die groter zijn dan 1 KB en die zijn aangeboden zonder Content-Encoding, een gemakkelijke compressiemogelijkheid die de meeste servers kunnen inschakelen met één configuratieregel. En het markeert CSS- of JavaScript-verzoeken die zijn gestart vóór de eigen DOMContentLoaded-offset van de pagina, de klassieke handtekening van een weergaveblokkerende asset.

Dit alles draait op gegevens die al in het bestand staan dat u uploadt: er is geen netwerktoegang, geen externe opzoekservice en het opnieuw ophalen van de originele pagina. Het HAR-bestand wordt volledig in uw browsertabblad gelezen, geparseerd en weergegeven en wordt nooit ergens geüpload.