Home → PERFORMANCE → HAR Performance Analyzer Tool
HAR Performance Analyzer Tool
Browser-based performance analysis tool for debugging slow websites and identifying optimization opportunities.
What is HAR (HTTP Archive)?
HAR is a JSON format that logs all browser network activity when loading a webpage. It captures:
- Every HTTP request/response
- Detailed timing data (DNS lookup, connection, download, etc.)
- Request/response headers and content
- Cache behavior and redirects
- Error codes and status information
Think of it as a detailed performance audit log for your website.
How to Capture HAR Files
Chrome/Edge (Recommended)
# Quick steps:
F12 → Network tab → Reload page → Right-click → "Save all as HAR with content"
Detailed steps:
1. Open DevTools: Press F12 or right-click → Inspect
2. Network tab: Click the Network tab (clear it if needed)
3. Record: Ensure recording is on (red dot should be visible)
4. Navigate: Reload the page or navigate to the slow page
5. Export: Right-click any request → "Save all as HAR with content"
Firefox
F12 → Network tab → Reload → Right-click → "Save All as HAR"
Safari
Develop menu → Web Inspector → Network tab → Export HAR
Note: Enable Develop menu in Safari Preferences → Advanced
Mobile/Remote Debugging
- Android Chrome: Use
chrome://inspecton desktop - iOS Safari: Use Safari → Develop → [Device Name]
- Remote devices: Use browser dev tools remote debugging
Features
- File Upload: Drag & drop or browse for HAR files
- Performance Metrics: Total load time, requests count, data transferred
- Request Analysis: Breakdown by content type (HTML, CSS, JS, images, etc.)
- Timing Breakdown: DNS, connection, SSL, waiting, and download times
- Performance Issues: Identifies slow requests, large files, and optimization opportunities
- Detailed Request List: Sortable table with all network requests
- Export Results: Download analysis as JSON or CSV
Performance Insights & Analysis
Key Metrics Extracted:
- Total Page Load Time: Complete loading duration (DOMContentLoaded, Load events)
- Request Count: Total HTTP requests made
- Data Transfer: Size analysis (compressed/uncompressed, by content type)
- Performance Budget: Compare against industry benchmarks
Detailed Breakdowns:
- By Content Type: HTML, CSS, JS, Images, Fonts, XHR/API calls
- By Timing Phase: DNS → Connect → SSL → Send → Wait → Receive
- By Performance Impact: Critical path resources vs. non-blocking
- By Cache Status: Cache hits/misses, cache policy analysis
Problem Identification:
- Slowest Requests: Requests taking >500ms (potential bottlenecks)
- Largest Files: Files >100KB (compression candidates)
- Failed Requests: 4xx/5xx errors affecting user experience
- Render Blocking: CSS/JS blocking page rendering
Optimization Recommendations
Immediate Actions (High Impact):
- Enable Compression: Gzip/Brotli for text files >1KB
- Image Optimization: Convert to WebP, proper sizing, lazy loading
- Cache Headers: Set proper Cache-Control headers (static: 1 year, API: 5 minutes)
- Minification: Remove whitespace from CSS/JS (can save 20-40%)
Performance Optimizations:
- Reduce Requests: Bundle CSS/JS files, use CSS sprites
- CDN Implementation: Serve static assets from geographically closer servers
- Critical Path: Inline critical CSS, defer non-critical JS
- Preloading: Use
<link rel="preload">for important resources
Server-Side Improvements:
- HTTP/2: Enable multiplexing and server push
- Database Optimization: Slow API calls often indicate DB issues
- Resource Hints: Use dns-prefetch, preconnect for third-party domains
HAR Timing Breakdown Explained
Each request in a HAR file contains these timing phases:
|--blocked--|--dns--|--connect--|--ssl--|--send--|--wait--|--receive--|
↓ ↓ ↓ ↓ ↓ ↓ ↓
Queue Lookup TCP HTTPS Request Server Download
wait domain handshake setup sending processing response
Timing Phases:
- blocked (0-20ms): Time spent in browser queue waiting for available connection
- dns (0-100ms): DNS resolution time - cache misses can spike this
- connect (0-300ms): TCP connection establishment - high values indicate network issues
- ssl (0-500ms): SSL/TLS handshake - expensive for new connections
- send (0-10ms): Time to send HTTP request - usually minimal
- wait (100-5000ms): Server processing time - MOST IMPORTANT for optimization
- receive (10-1000ms): Time to download response - affected by file size and bandwidth
Performance Targets:
- Total time: <200ms for critical resources, <1s for non-critical
- wait time: <500ms for API calls, <100ms for cached resources
- dns time: <50ms (use CDN or DNS prefetching if higher)
- ssl time: <200ms (enable HTTP/2 and connection reuse)
Browser Support
Works in all modern browsers:
- Chrome 60+
- Firefox 55+
- Safari 12+
- Edge 79+
Common Performance Issues Found in HAR Analysis
🐌 Slow Server Response Times
- Symptoms: High "wait" times (>1000ms)
- Causes: Slow database queries, inefficient code, server overload
- Solutions: Database optimization, caching, server scaling
📦 Large File Sizes
- Symptoms: Large "receive" times, high transfer sizes
- Causes: Uncompressed files, oversized images, unnecessary code
- Solutions: Enable compression, image optimization, code splitting
🌐 Too Many HTTP Requests
- Symptoms: 100+ requests, multiple small files
- Causes: Unbundled CSS/JS, many small images
- Solutions: Bundle files, use CSS sprites, HTTP/2
🔄 Cache Misses
- Symptoms: Repeated requests for same resources
- Causes: Missing cache headers, cache-busting on static files
- Solutions: Set proper Cache-Control headers, use versioned URLs
Security & Privacy
⚠️ Important: HAR files contain sensitive data including:
- Session cookies and authentication tokens
- POST request bodies and form data
- API responses and personal information
- Internal URLs and server details
Best Practices:
- Sanitize HAR files before sharing (remove sensitive headers/data)
- Use tools locally - avoid uploading HAR files to online analyzers
- Limit scope - only capture the specific pages you're debugging
- Clean up - delete HAR files after analysis
This analyzer processes everything locally in your browser for maximum security.