«   Previous tip Next tip   »

Chrome DevTools: New performance metrics with the Performance Monitor

Last updated: 21st September 2019
New performance metrics with the Performance Monitor

The DevTools Performance Monitor features a live-updating visualisation which highlights performance bottlenecks in your page. As you interact with the page (scrolling, navigating etc.), the visualisation updates along with it.

The Performance Monitor is a great starting point for a high-level performance overview. Unexpected spikes (e.g. a spike in CPU usage when you scroll the page) can then be investigated further with the Performance Panel.

You can open the Performance Monitor by searching for 'Show Performance Monitor' in the DevTools Command Menu (Cmd + Shift + P).

The performance metrics (the categories on the left side) can be toggled on and off, which can help make the visualisation digestible. These categories are:

«   Previous tip Next tip   »

Sign up to receive a developer tip, in the form of a gif, in your inbox each week