⭐ 0
🔍
Text Bild PDF och dokument Ljud Musik Elektronik Tid Verktyg Validatorer Esoterik Spel

HAR File Waterfall Analyzer

Ladda upp en .har-fil som exporterats från din webbläsares DevTools för att se ett verkligt förfrågningsvattenfall byggt från varje begärans egen tidsdata, plus kontroller för saknade cachehuvuden, okomprimerade svar och skript som blockerar renderingen.

Dra och släpp filen här eller klicka för att bläddra

Exportera en HAR-fil från din webbläsares DevTools → Network-flik (högerklicka på begärandelistan → "Spara alla som HAR med innehåll") och släpp den här. Allt analyseras och renderas lokalt - filen laddas aldrig upp någonstans.

Buy Me a Coffee at ko-fi.com
Bearbetar... 0%
Parsar HAR-fil
Bygga vattenfall
Analysera förfrågningar
Klart

Resultat

En HAR-fil (HTTP Archive) är en JSON-export av allt som en webbläsares DevTools Network-panel registrerat under en sidladdning: varje begäran och svarshuvud, den exakta storleken och MIME-typen för varje svarstext och en tidsuppdelning per begäran. Du kan skapa en från Chrome, Firefox, Edge eller Safari genom att öppna DevTools, ladda om sidan på fliken Nätverk, sedan högerklicka på begärandelistan och välja "Spara allt som HAR med innehåll". Det här verktyget läser den exporterade filen direkt - ingenting hämtas eller begärs på nytt.

Vattenfallsdiagrammet är byggt helt och hållet från data som redan finns i filen: varje posts eget timingsobjekt delar upp en begäran i blockerade, DNS-uppslagning, anslut, SSL/TLS-förhandling, skicka, vänta (tid till första byte) och mottagningsfaser, och varje fas ritas som sitt eget färgade segment. Enligt HAR-specifikationen är SSL-tiden också inkluderad i connect, så den subtraheras tillbaka ut först – annars skulle TLS-delen räknas två gånger och streckbredderna skulle inte längre läggas till förfrågans verkliga varaktighet. Streckade vertikala markörer visar DOMContentLoaded och Load, läser direkt från filens egna sidtider, så att du kan se exakt vilka förfrågningar som avslutades innan sidan blev interaktiv.

Utöver diagrammet kör verktyget tre sökregler över fält som HAR-formatet redan registrerar. Den flaggar cachebara svar (status 200, 203 eller 206) som varken har en Cache-Control eller en Expires-huvud, vilket innebär att ett upprepat besök måste ladda ner dem igen från början. Den flaggar textsvar – HTML, CSS, JavaScript, JSON, SVG och liknande – som är större än 1 KB som visades utan innehållskodning, en enkel komprimeringsmöjlighet som de flesta servrar kan slå på med en konfigurationsrad. Och den flaggar CSS- eller JavaScript-förfrågningar som startade före sidans egen DOMContentLoaded-offset, den klassiska signaturen för en renderingsblockerande tillgång.

Allt detta körs på data som redan finns i filen du laddar upp - det finns ingen nätverksåtkomst, ingen extern uppslagstjänst och ingen återhämtning av den ursprungliga sidan. HAR-filen läses, tolkas och renderas helt och hållet på din webbläsarflik och laddas aldrig upp någonstans.

🛡️
Körs i webbläsare

Dina filer och indata lämnar aldrig den här enheten. Bearbetningen körs helt offline. 100 % säker.

Godkända format och regler

  • Canvas-renderad begäran vattenfall färgad av timing fas, med DOMContentLoaded och Load markörer.
  • Tre regelbaserade sökgrupper: saknade cachehuvud, okomprimerade textsvar och renderingsblockerande kandidater.
  • Helt offline: den uppladdade .har-filen analyseras och analyseras helt och hållet i din webbläsare – ingenting skickas någonstans.

Viktiga fördelar

✓ Real Waterfall From Real Timings: Varje stapel dras direkt från varje begärans egna blockerade/DNS/anslut/SSL/sänd/vänta/ta emot faser — ingenting uppskattas eller mäts om.
✓ Missing Cache Detector: Flaggor 200/203/206-svar skickas utan Cache-Control och utan Expires-huvud, så upprepade besök hämtar dem igen för ingenting.
✓ Okomprimerad svarssökare: Flaggar textbaserade svar över 1 kB utan innehållskodning, en vanlig och enkel komprimeringsvinst.
✓ Renderblockerande kandidater: Korsreferenser CSS/JS-förfrågningar mot sidans egen DOMContentLoaded-timing för att flagga skript och stilmallar som hämtats innan sidan kunde renderas.

Användningsfall

  • • Diagnostisera varför en sida känns långsam genom att ladda upp dess exporterade HAR-fil och läsa den verkliga tidsuppdelningen per begäran istället för att gissa från en skärminspelning.
  • • Granska en webbplatss cachningsstrategi genom att hitta varje svar som skickas utan Cache-Control eller Expires header och som skulle laddas ner igen vid varje upprepat besök.
  • • Upptäck renderingsblockerande CSS eller JavaScript innan du kör en fullständig prestandarevision genom att kontrollera vilka förfrågningar som startade före DOMContentLoaded i en inhämtad HAR-fil.