CPU and JavaScript timeline
Each DebugBear result contains a timeline of work done on the page main thread.
Most of this work often consists of JavaScript code execution. However, it also includes other CPU tasks, such as calculating the page layout, or parsing HTML code.
The timeline only shows work done on the main thread of the page, so CPU tasks in iframes are not included.
DebugBear CPU timeline
You can find the CPU timeline on the Overview tab.
Combined with the filmstrip you can see if CPU processing is delaying your page load.
This example shows the CPU timeline for a page rendering 16 charts with over 2000 values each. You can see how JavaScript execution is interspersed with layout logic for each chart.
You can hover over each CPU tasks to see:
- the type of processing
- what files the work is attributable to (for example what JavaScript bundles)
Short tasks
Note that tasks with a duration of less than 10ms are not included in the CPU timeline.
Overall CPU processing breakdown
The Performance tab also provides an overall breakdown of CPU main-thread work on the tested page: