Skip to content

Chrome DevTools

Record what Chrome downloads and what the page does as you load it or click a button. Use the recording to investigate one specific delay.

Read official information

Should you open Network or Performance?

Open Network if you want to know which file or request is taking time. Open Performance if you want a recording of what the browser was doing while a page loaded or a button responded slowly.

In desktop Chrome, right-click the page and choose Inspect, then open the panel you need. These panels come with Chrome and this workflow requires no separate account or testing service.

With recording enabled, Network logs requests while DevTools is open. Reload for a page-load problem, or leave the page open and repeat the slow action for an interaction problem. Select a request and open Timing to see how much of the delay was spent waiting for the first response versus downloading it. A long wait can include network travel and server work.

How can you investigate one slow click?

Try this on a local sample page where a button filters a list of fictional items. Confirm that the list is bundled with the sample and the page has no live accounts or connected services before opening it. If you cannot confirm that setup, sketch the steps without running the app.

  1. Look for a request
    Let the page finish loading. Open Network and clear the log. Click the filter once and see whether a request appears at the moment the list changes. A click that starts no request can still take time to update the page.
  2. Record the interaction
    Reset the filter. Open Performance, start a recording, click the same filter once and stop. Find that click in the Interactions track. Check whether the time is spent waiting before processing, processing the click, or drawing the next screen update.
  3. Keep a small comparison
    If most of the time is in processing, try a smaller fictional list and record again with the same browser and settings. Compare the processing time and check that the filter still shows the right items. This tests whether list size affects that click.

What does one recording tell you?

A recording describes that attempt in your browser. Keep the tested page, action, device and cache or throttling settings with your notes. Repeat under the same conditions before treating a small change as an improvement.

Use a Lighthouse audit when you want a broader set of automated findings on a page. PageSpeed Insights can also show a summary of eligible Chrome visitors on a public site. Your click recording is useful for locating what took time in a specific session, even when there is no public visitor data for that screen.

What should you keep or share?

Start with a short note describing the sample page, the exact action and the timing you observed. Chrome can also save a Performance trace or export a Network log called a HAR file when you need the full recording.

Share a recording from a disposable sample. A trace can include screenshots or resource content, and a network log can contain private addresses or request details. Chrome's sanitized HAR option removes certain sensitive headers. Check the file for other private details before sharing.