The Trace Event Profiling Tool (about:tracing)
When diagnosing performance problems it can be valuable to see what Chrome is doing "under the hood." One way to get a more detailed view into what's going on is to use the about:tracing tool.
- Recording Tracing Runs; start with this, it's prerequisite for using about:tracing.
- How to use the Frame Viewer to Bust Jank; read this next, to understand how to diagnose rendering performance problems.
- Jank Case Study 1; then read this, for further examples of how to effectively use about:tracing in conjunction with the Dev Tools timeline
Note that to understand what's happening in trace events you'll need a basic understanding of how the browser works. The above articles provide enough to get started, but it's recommended to first read at minimum:
- The Rendering Critical Path for a little more background, and...
- Anatomy of Jank for precise explanations of various rendering performance problems
- A presentation from pdr@ on how to debug the graphics stack with tracing
- Frame Viewer Basics, a short guide for how to navigate the frame viewer view. This is more succinct but less informative than frame viewer how-to above.
- Saving Skia Pictures; this is useful if you want to capture isolated SkPictures for the Skia team.
- Tracking memory allocations with memory-infra tracing
Even further reading:
- How to Understand about:tracing results (somewhat out of date; refer to the Frame Viewer how-to instead)
Start by perusing the Tracing Ecosystem Explainer to understand the various different pieces of code involved.
- To add functionality to the about:tracing viewer itself, see
- trace-viewer lives in its own repository on GitHub, not in the Chromium tree.