Öffne, untersuche und filtere HTTP-Archivaufzeichnungen in deinem Browser
Verstecke Session-Tokens, Passwörter und Cookies mit einem Klick, bevor du deine Aufzeichnungen mit Support-Teams teilst. Der HAR-Viewer von DevBento läuft komplett in deinem Browser, ohne Serverlast. Filtere Anfragen nach Kategorie, Dauer, Größe oder Fehlerstatus. Jede Anfrage erhält ein Wasserfalldiagramm mit den Phasen: blockiert, DNS, Verbindung, SSL, Senden, Warten und Empfangen.
Funktionen
Wasserfalldarstellung. Jede Anfrage wird als horizontaler Balken dargestellt, segmentiert nach Zeitphasen, genau wie in Chrome DevTools. Farben sind bestimmten Phasen zugeordnet: blockiert (grau), DNS (blau), Verbindung (türkis), SSL (meergrün), Senden (grün), Warten (bernsteinfarben), Empfangen (hellgrün). Bewege die Maus über ein Segment, um die genaue Dauer in Millisekunden zu sehen.
Intelligente Filter. Reduziere die Anfragen mit Kategorie-Tabs (HTML, CSS, Skripte, Fetch/XHR, Bilder, Schriftarten, Medien, Sonstige), Dropdown-Menüs für Dauer und Größe oder den Umschaltern Nur Fehler und Große Ladevorgänge. Das Suchfeld filtert nach URL, Methode oder Statuscode.
Bereinigung mit einem Klick. Entfernt Authorization-Header, Cookies, set-cookie-Header, API-Schlüssel, Passwörter und Tokens. Der Rest der HAR-Daten (Zeiten, Statuscodes, URLs, Ladestruktur) bleibt für die Fehlersuche intakt.
Bereinigtes HAR exportieren. Lade die bereinigte Datei als gültiges HAR-JSON herunter, bereit zum Teilen mit QA-, Support- oder Entwicklerteams.
Performance-Audits. Das Tool überprüft deine HAR-Datei automatisch auf langsame TTFB-Antworten (>800ms), unkomprimierte Textressourcen, große Ladevorgänge (>2MB) und doppelte URLs. Jeder Audit enthält Links, um direkt zu den betroffenen Anfragen zu springen.
Reine Client-Seite. Deine Netzwerkaufzeichnungen bleiben auf deinem Rechner. Kein Hochladen, keine Serververarbeitung, kein Upload.
Verwendung
- Öffne die Entwicklertools deines Browsers (F12), gehe zum Netzwerk-Tab
- Lade die Seite neu oder interagiere mit der Website, um Netzwerkverkehr aufzuzeichnen
- Klicke mit der rechten Maustaste auf eine Anfrage und wähle Alle als HAR speichern (oder nutze den Export-Button im Netzwerk-Tab)
- Ziehe die .har-Datei per Drag & Drop in den Viewer oder klicke zum Durchsuchen und Auswählen
- Navigiere durch die Anfragen mit den Kategorie-Tabs und Filtern. Die Details jeder Anfrage erscheinen im unteren Bereich
- Klicke auf Daten bereinigen, um Authentifizierungstokens und Cookies automatisch aus der exportierten Datei zu schwärzen
- Klicke auf Exportieren, um die bereinigte Version als neue .har-Datei herunterzuladen
Performance-Tipps
Konzentriere dich auf langsame Anfragen. Nutze den Dauerfilter, um Anfragen über 1 Sekunde zu isolieren. Eine einzelne langsame Anfrage ist meist kein Problem, aber mehrere können auf Server-Engpässe hindeuten.
Prüfe Blockierung. Ein hoher Anteil an blockierter Zeit in der DNS- oder Verbindungsphase deutet darauf hin, dass der Browser die gleichzeitigen Verbindungen pro Domain überschreitet. Erwäge, Ressourcen auf mehrere Domains zu verteilen oder HTTP/2 zu verwenden.
Suche nach großen Downloads. Unkomprimierte Ressourcen (besonders JSON, HTML oder CSS) verlängern die Ladezeit. Stelle sicher, dass dein Server mit gzip- oder brotli-Kompression ausliefert.
Vermeide doppelte Anfragen. Identische URLs, die mehrfach geladen werden, deuten auf Cache-Probleme hin. Überprüfe die Cache-Header und das Service-Worker-Verhalten.