How to Capture Performance Data for your Web Browser

As performance for a website can be caused by a variety of things such as performance degradation on the website's side to internet speed or network security on the PC side, etc. it can be difficult to find the cause for slow performance. To help find the cause of these issues, we will request that you aid us by providing additional information for further review.

Recording Web Browser Performance

One of the best ways to aid us is by having your web browser record what is happening as you experience these issues so we can see what is going on at a deeper level after the fact. As each web browser has different steps to accomplish this, we have provided the instructions for the most popular web browsers below on their latest versions.

Click here if you use Google Chrome
  1. Go to the page where you are seeing the issue (e.g. Time Card Details, Reports, etc.) or can recreate the issue.

    How_to_Capture_Performance_Data_for_your_Web_Browser__360034345373__HAR_-_CHROME_-_01_-_Time_Card_Detail.png

  2. Right-click anywhere on the page and click on Inspect Element or press F12 on your keyboard. The developer tools will open at the bottom or the side of your browser.

    How_to_Capture_Performance_Data_for_your_Web_Browser__360034345373__HAR_-_CHROME_-_02_-_Right_Click.png

    How_to_Capture_Performance_Data_for_your_Web_Browser__360034345373__HAR_-_CHROME_-_05_-_Open_Developer_Tools.png

  3. Click on the Network tab.

    How_to_Capture_Performance_Data_for_your_Web_Browser__360034345373__HAR_-_CHROME_-_03_-_Network_Circled.png

  4. Click on the record button if it is not currently recording and refresh the page, click on the link that takes you to the issue, or recreate what you are experiencing. The goal is to reproduce the issue that you are experiencing while your web browser is recording what is happening.
  5. After you have recorded the issue, you should see some colored lines appear in the timeline.

    How_to_Capture_Performance_Data_for_your_Web_Browser__360034345373__HAR_-_CHROME_-_04_-_Recorded.png

  6. Right-click within the Network tab below the timeline and click Save as HAR with Content and save the file.

    How_to_Capture_Performance_Data_for_your_Web_Browser__360034345373__HAR_-_CHROME_-_04_-_Save_Har.png

  7. Make note of where the HAR file is saved so you can send it to us later.
Click here if you use Mozilla Firefox
  1. Go to the page where you are seeing the issue (e.g. Time Card Details, Reports, etc.) or can recreate the issue.

    How_to_Capture_Performance_Data_for_your_Web_Browser__360034345373__HAR_-_FIREFOX_-_01_-_Time_Card_Detail.png

  2. Go to Tools from Firefox's top bar, go to Web Developer, and click on Network. A network dialog will appear at the bottom of your web browser. If you don't see the Firefox menu bar, press Alt on your keyboard for it to appear.

    How_to_Capture_Performance_Data_for_your_Web_Browser__360034345373__HAR_-_FIREFOX_-_06_-_Tools.png

  3. Towards the right-hand side, click the gear icon and enable the option for "Persist Logs." This will allow Firefox to keep any logging data between web pages.

    Performance_Data_-_00.png

  4. Refresh the page, click on the link that takes you to the issue or recreates what you are experiencing. The goal is to reproduce the issue that you are experiencing and have your web browser record what is happening.

    How_to_Capture_Performance_Data_for_your_Web_Browser__360034345373__HAR_-_FIREFOX_-_04_-_Network_Recorded.png

  5. Right-click on any line in the Network tab and click Save All As HAR to save the HAR file.

    How_to_Capture_Performance_Data_for_your_Web_Browser__360034345373__HAR_-_FIREFOX_-_05_-_Save.png

  6. Make note of where the HAR file is saved so you can send it to us later.
Click here if you use Safari 8 or later
  1. Check to see if you have the "Develop" option in the menu bar at the top of your web browser.

    How_to_Capture_Performance_Data_for_your_Web_Browser__360034345373__HAR_-_SAFARI_-_01_-_Developer_Menu_bar.png

    • If you do not see it, go to Safari, click on Preferences, click on Advanced, and enable "Show Develop Menu in Menu Bar."

      How_to_Capture_Performance_Data_for_your_Web_Browser__360034345373__HAR_-_SAFARI_-_02_-_Preferences.png

      How_to_Capture_Performance_Data_for_your_Web_Browser__360034345373__HAR_-_SAFARI_-_03_-_Advanced.png

      How_to_Capture_Performance_Data_for_your_Web_Browser__360034345373__HAR_-_SAFARI_-_04_-_Enable.png

  2. Go to the page where you are seeing the issue (e.g. Time Card Details, Reports, etc.) or can recreate the issue.
    How_to_Capture_Performance_Data_for_your_Web_Browser__360034345373__HAR_-_SAFARI_-_05_-_Time_Card.png
  3. Go to Develop and click Show Web Inspector. The Web Inspector will appear near the bottom of Safari.

    How_to_Capture_Performance_Data_for_your_Web_Browser__360034345373__HAR_-_SAFARI_-_06_-_Open_Developer_Tools.png

    How_to_Capture_Performance_Data_for_your_Web_Browser__360034345373__HAR_-_SAFARI_-_07_-_Developer_Tools.png

  4. Click on the Network tab.

    How_to_Capture_Performance_Data_for_your_Web_Browser__360034345373__HAR_-_SAFARI_-_08_-_Click_Network.png

  5. Refresh the page, click on the link that takes you to the issue or recreates what you are experiencing. The goal is to reproduce the issue that you are experiencing and have your web browser record what is happening.
  6. Click Export to export the recorded information as a HAR file.

    How_to_Capture_Performance_Data_for_your_Web_Browser__360034345373__HAR_-_SAFARI_-_09_-_Export.png

  7. Make note of where the HAR file is saved so you can send it to us later.
Click here if you use Microsoft Edge
  1. Go to the page where you are seeing the issue (e.g. Time Card Details, Reports, etc.)

    How_to_Capture_Performance_Data_for_your_Web_Browser__360034345373__HAR_-_EDGE_-_01_-_Time_Cards.png

  2. Right-click the webpage and click Inspect Element or press F12 on your keyboard. A small window should open.

    How_to_Capture_Performance_Data_for_your_Web_Browser__360034345373__HAR_-_EDGE_-_02_-_Inspect_Element.png

    How_to_Capture_Performance_Data_for_your_Web_Browser__360034345373__HAR_-_EDGE_-_04_-_Developer_and_Time_Card_clean_2.png

  3. Click the Network tab.

    How_to_Capture_Performance_Data_for_your_Web_Browser__360034345373__HAR_-_EDGE_-_05_-_Press_PLAY2.png

  4. Click the small green arrow to begin recording your web browser if it doesn't start automatically.

    How_to_Capture_Performance_Data_for_your_Web_Browser__360034345373__HAR_-_EDGE_-_05_-_Press_PLAY3.png

  5. Refresh the page, click on the link that takes you to the issue or recreates what you are experiencing. The goal is to reproduce the issue that you are experiencing and have your web browser record what is happening.

    How_to_Capture_Performance_Data_for_your_Web_Browser__360034345373__HAR_-_EDGE_-_04_-_Developer_and_Time_Card_Recorded.png

  6. Click on Export as HAR and save the HAR file.

    How_to_Capture_Performance_Data_for_your_Web_Browser__360034345373__HAR_-_EDGE_-_06_-_Export_as_HAR_Arrow.png

  7. Make note of where the HAR file is saved so you can send it to us later.
Click here if you use Microsoft Internet Explorer 11
  1. Go to the page where you are seeing the issue (e.g. Time Card Details, Reports, etc.)

    How_to_Capture_Performance_Data_for_your_Web_Browser__360034345373__HAR_-_IE-_01_-_Time_Card_Detail.png

  2. Press F12 or go to the gear/settings icon and click on Developer Tools. The Developer Tools will appear at the bottom of your web browser.

    How_to_Capture_Performance_Data_for_your_Web_Browser__360034345373__HAR_-_IE-_02_-_Developer_Tools.png

    How_to_Capture_Performance_Data_for_your_Web_Browser__360034345373__HAR_-_IE-_03_-_Console_Blank.png

  3. Click the Network tab and click Clear Session.

    How_to_Capture_Performance_Data_for_your_Web_Browser__360034345373__HAR_-_IE-_03_-_Console.png

    How_to_Capture_Performance_Data_for_your_Web_Browser__360034345373__HAR_-_IE-_04_-_Clear_Session.png

  4. Refresh the page, click on the link that takes you to the issue or recreates what you are experiencing. The goal is to reproduce the issue that you are experiencing and have your web browser record what is happening.
  5. Click the Save icon to save the session as a HAR file.

    How_to_Capture_Performance_Data_for_your_Web_Browser__360034345373__HAR_-_IE-_05_-_Save_HAR.png

  6. Make note of where the HAR file is saved so you can send it to us later.

Internet Speed

Internet speeds play a crucial part in the performance of any website. Knowing your internet speed can help us determine the causes of website performance issues.

Computer Information

The specifications of your computer can affect how quickly your web browser can process/present information such as how quickly your web browser responds to your clicks, how quickly it displays a web page, how many tabs you can have open, etc.

Was this article helpful?
0 out of 0 found this helpful