Chrome DevTools Completes Soft Navigation Analysis for SPAs and Adds a CPU-Tier Override
You can now analyze the speed of an SPA’s “page changes” right in DevTools, and reproduce performance tests for different hardware tiers from code.
Chrome DevTools has added two performance features for developers of SPAs (web apps that change the screen without a full page reload). One is soft-navigation analysis in the Performance panel’s Insights. The other is a Chrome DevTools Protocol (CDP, the interface for controlling DevTools from code) command that sets a CPU performance tier. Both are in the Chrome for Developers DevTools update post (covering Chrome 153 and 154, published September 22).
What a soft navigation is
Normally, clicking a link makes the browser fetch a new page from the server. An SPA works differently: JavaScript changes only the URL in the address bar and swaps part of the screen. To the user it looks like going to a new page, but the browser doesn’t know that “a new page was opened.”
Because of that, the loading metric (LCP) was measured only once, at the first load, and later screen changes dropped out of the measurement. The Soft Navigations API is meant to treat such changes as navigations and measure their performance separately.
- In Chrome 152, soft-navigation support landed in DevTools’ Live Metrics and trace views.
- Now analysis has been added to the Performance panel’s Insights, which Chrome describes as “completing full end-to-end support” from measurement to analysis.
Setting a CPU performance tier from code
- The new CDP command is
Emulation.setCPUPerformanceOverride. It sets a calibrated CPU performance tier, which Chrome says enables “reproducible performance testing across hardware tiers.” - The older approach (
Emulation.setCPUThrottlingRate) slowed the CPU by a fixed multiplier such as “4x slower.” The new approach is reported to measure your own PC’s real performance first, build reference points such as “low-tier mobile” and “mid-tier mobile,” and match those tiers.
The details (which tiers exist, how calibration works) are not explained at length in Chrome’s post. The calibration presets are described based on the DevTools throttling documentation.
Claims we could not confirm
- “Integrated monitoring with the Soft Navigation Timing API is provided”: DevTools analysis support and the API’s full release are separate things. In a post on April 20, Chrome opened a final origin trial (a test period in which selected sites can try a feature early) covering Chrome 147 to 149 and said only that it plans to launch the API later this year. We could not confirm whether it has fully launched since. Some outside articles say it has shipped, but this could not be confirmed from Chrome’s own material.
- “Targets frameworks such as React and Next.js”: we could not find any mention of frameworks in Chrome’s post. The scope appears to be SPA-style screen changes in general, not specific frameworks.
- “A set of commands”: the only new CDP command confirmed in Chrome’s post is
Emulation.setCPUPerformanceOverride. - Date: Chrome’s post was published on September 22 (the page title says “October 2026”).
What could change for developers
What follows is our estimate and advice based on the official post.
- What you can try right away. In Chrome 153 or later, the Performance panel’s Insights can show bottlenecks per screen change in an SPA. It is useful for finding “what is slow when moving between routes” instead of looking only at the first load.
- Collecting real-user data is still early. The Soft Navigations API is not fully released, so check browser support separately before using it to collect real visitors’ transition performance.
- Same conditions in automated tests. In CI (checks that run automatically on every code push) or end-to-end tests (run with tools that drive a browser automatically, such as Puppeteer and Playwright), fixing a CPU tier makes it easier to compare “did this change make it slower?” against the same baseline.
- Compare on the same machine. Tiers are built by calibrating each PC’s performance. Baselines may differ between teammates and CI machines, so it is safer to compare in the same environment.
What to watch
The Soft Navigations API’s full release date and support in other browsers, the official documentation and parameters for Emulation.setCPUPerformanceOverride, and how frameworks such as Next.js hook into soft navigations.
Sources
Source: developer.chrome.com