How to generate a HAR file for Support

In order to help us diagnose your performance issues in PICSWeb, we’d like you to record a HAR file (HTTP Archive) using your browser, and send this to us. This can be considered a log or ‘recording’ of how well your web browser, and our website, are communicating with one-another whilst the HAR file is being recorded.

If the performance issues you’re reporting involve an error message in PICSWeb, please also take a full-screen screenshot of that error message to send to us – so we can see what time the error appeared, and more easily check what was happening at that point in the HAR file’s log.

HAR file log recordings are started, stopped, and exported, from the ‘Debug Panel’ of your web browser (normally opened with the F12 key).

We’ve provided some labelled screenshots (beneath the steps listed below), to illustrate how these ‘Debug Panels’ will appear, in three of the most popular web browsers (Edge, Chrome, and Firefox).

Although different web browsers have slightly different layouts for their ‘Debug Panels’, and certain buttons may have slightly different names, the steps you’ll need to follow remain essentially the same:

How to generate a HAR file recording in your web browser

 

  1. Open your web browser, and navigate to the area where the issue’s occurring, and where you’d like to begin the HAR recording.

  2. Press F12 to open the debug panel; or open the ‘More Tools’ section of your browser’s settings menu, and select “Developer Tools”.

  3. When the debug panel is opened, select the Network tab. If this is not visible, then you should either widen the debug panel; or press the icon which opens a list of the unseen sections (usually “+” or “>>”), and select “Network” from within there.

  4. Click the Clear button (🛇), to empty any existing logs from the ‘Network' tab, ready to begin a fresh recording. If the console already starts to fill up with more logged information, press the ‘Start/Stop Recording' button described in Step 6 to pause this, and then 'Clear’ the log again.

  5. Tick the box labelled “Preserve Log” (in FireFox, this is instead labelled “Persist Logs”). This option prevents the HAR logs you’re about to record from being 'cleared' each time you navigate to a new web page.

  6. Press the Record Network Log button to start recording (this will either resemble a ‘play/pause’ symbol; or an empty circle that will be filled in while the recording’s happening).

  7. Now that your browser’s network requests are being recorded, reproduce the performance issues you were experiencing.
    Try to navigate or interact with the areas of PICSWeb that are seeming unusually slow. If your issue involves encountering an error message, remember to take a screenshot of that error when it appears, with your computer’s clock visible, so we know what time the error will appear in your HAR file log!

  8. Once you have recorded the performance issues you were experiencing, and any error messages which occurred, press the Record Network Log button again to stop recording.

  9. Press the Export HAR button (or in Firefox, select “Save All as HAR”); which usually will resemble your browser’s downloads icon (a downwards arrow, pointing to a horizontal bar: ⤓)
    When you’ve downloaded the HAR file from your browser, please send this to us, along with (if applicable) the screenshot you captured of your error message.

Microsoft Edge:

image-20240409-100343.png

Google Chrome:

image-20240409-100433.png

Mozilla Firefox: