v139 · Origin Trial · Performance

SoftNavigation Performance Entry

A new PerformanceEntry type for Single-Page Application route changes. Each client-side navigation produces a SoftNavigationEntry with its own navigationId — unlocking per-navigation Core Web Vitals for SPAs.

Origin Trial (Chrome 147–149). SoftNavigation entries require the SoftNavigationHeuristics origin trial or chrome://flags/#soft-navigation-heuristics. Demos simulate the API output when the flag is not enabled.

concepts

  1. SPA Navigation Observer

    Wire a PerformanceObserver to the 'soft-navigation' entry type. Trigger simulated SPA route changes and watch each SoftNavigationEntry arrive with its interactionId, navigationId, URL, and timing fields.

  2. Core Web Vitals Dashboard

    See how the navigationId on a SoftNavigationEntry acts as a correlation key for LCP, INP, and CLS entries — enabling accurate, per-route Web Vitals measurement across a multi-page SPA session.

  3. Multi-Page Comparison

    Navigate a simulated SPA and watch each route change produce a distinct SoftNavigationEntry in the timeline — separate from the initial hard navigation, each with its own navigationId, start time, and LCP attribution.

  4. Observer Playground

    Three live PerformanceObservers wired up: soft-navigation, largest-contentful-paint, and event. Navigate the toy SPA on the left and watch the navigationId tie everything together.

why it shipped

Single-Page Applications handle routing in JavaScript — the browser never fires a traditional navigation event. This meant Core Web Vitals (LCP, INP, CLS) were only measured for the initial page load, making it impossible for SPA developers to understand performance for routes that users visit after the first one. SoftNavigation performance entries solve this by giving each client-side navigation its own stable identifier that LCP, INP, and CLS entries can reference, so real-user monitoring tools can report accurate, per-route vitals for any SPA — React Router, Next.js, Nuxt, Svelte Kit, or hand-rolled.

references