What is a HAR File ?

HAR stands for HTTP Archive. It’s a file format used to record and log a web browser’s interaction with a website. HAR files capture all network requests and responses, including detailed information like headers, cookies, timings, and payload data.

They are mainly used for:

  • Debugging website performance issues

  • Diagnosing network problems

  • Understanding resource loading times

  • Troubleshooting API requests

How to Generate a HAR File

  1. Open Developer Tools in your browser:

    • Chrome: Press F12 or Ctrl+Shift+I (Windows) / Cmd+Option+I (Mac)

    • Firefox: Same shortcuts as Chrome

    • Edge: Similar shortcuts

  2. Go to the Network tab.

  3. Make sure recording is enabled (red circle at top-left of Network panel).

  4. Perform the actions that reproduce the issue or load the webpage you want to analyze.

  5. Once finished, right-click inside the Network panel and choose “Save all as HAR with content” or a similar option depending on your browser.

  6. Save the .har file to your computer.

How to generate HAR files in different browsers. 

 How to Open and Read a HAR File

  • You can open HAR files in:

    • Browser developer tools (Network tab, import HAR)

    • Online HAR viewers (e.g., Google HAR Analyzer)

    • Desktop apps like Charles Proxy, Fiddler, or Wireshark

 Key Components of a HAR File

  1. Entries: Each network request and response is recorded as an entry.

  2. Request: Includes URL, method (GET, POST), headers, query strings, and cookies.

  3. Response: Status code, headers, cookies, and content (HTML, JSON, images, etc.)

  4. Timings: Breakdown of how long different phases took (DNS lookup, connection, SSL handshake, request sent, waiting, receiving data)

  5. Content size: Size of request/response bodies

 How to Analyze a HAR File

  • Check for failed requests: Look for red or non-200 status codes (404, 500, etc.).

  • Inspect slow requests: Look at the timing section to find requests that took longer than expected.

  • Look for large payloads: Large files (images, scripts) can slow down page load.

  • Verify request/response headers: Ensure expected headers (like authentication tokens, CORS) are present.

  • Trace redirect chains: Look for multiple redirects which can delay loading.

Example: Common Use Case

You have a webpage that loads slowly.

  • Open dev tools, capture HAR while loading the page.

  • Open HAR in viewer.

  • Sort requests by duration.

  • Identify the slowest requests.

  • Check their timings and content sizes.

  • Investigate if any large files or failed requests cause delays.

  • Use this info to optimize the page (compress images, fix server errors, reduce redirects).