Soft Navigations

A soft navigation is a client-side route transition in a Single-Page Application (SPA) that Chrome's browser heuristics classify as a navigation-like event — enabling per-route measurement of Core Web Vitals (LCP, CLS, INP) independently of the initial hard (document) navigation. Before this API, all Core Web Vitals for a SPA session accumulated against the single initial hard navigation, making Largest Contentful Paint (LCP) and Cumulative Layout Shift (CLS) scores meaningless for the most-visited deep-link destinations on SPA storefronts.

---

Stable release

The Soft Navigations API shipped as a stable, flag-free feature in Chrome 151, released July 28, 2026. The soft-navigation and interaction-contentful-paint PerformanceEntry types are available by default in Chrome 151+ and Edge 151+. Firefox and Safari do not support the API. MDN marks PerformanceSoftNavigation as "Experimental" and "Limited availability" as of 2026-09-04. (Chrome for Developers, developer.chrome.com/docs/web-platform/soft-navigations, updated 2026-09-02; MDN, updated 2026-09-04)

Timeline (as-of 2026-09-09):

• Origin trial 1 — Chrome 96, late 2021
• Origin trial 2 — Chrome 125–126, mid-2024
• Final origin trial — Chrome 147–149, beginning April 20, 2026 (incorporated feedback from prior trials; decoupled InteractionContentfulPaint from soft navigation detection; added replaceState as a qualifying trigger)
• Stable flag-free — Chrome 151, July 28, 2026

---

How Chrome detects a soft navigation (heuristics)

Chrome's canonical definition requires all three of the following to be met (Chrome for Developers, 2026-09-02):

1. Trusted user interaction — the navigation must be initiated by a genuine user action (click, tap, keyboard shortcut); programmatic navigations do not qualify
2. Visible URL change — a URL change must occur via the History API or Navigation API
3. Visible contentful paint — a visible contentful paint must result from that interaction

The detection is entirely browser-side. No framework, router, or data-layer code changes are required for an existing SPA to qualify. Sites using React Router, Next.js App Router, Vue Router, Nuxt, Angular Router, Remix, or Shopify Hydrogen (React Router v7 / Remix-based in 2026) are expected to qualify without modification, provided their route transitions meet all three criteria. SPAs that change the URL before painting, or paint before updating the URL, may see misaligned interaction-contentful-paint entries. (Chrome for Developers blog, final-soft-navigations-origin-trial, 2026-04-20; Apogee Watcher, 2026-07-28)

---

New PerformanceEntry types

Chrome 151 introduces two new Performance Timeline entry types (Chrome for Developers, 2026-09-02; MDN, 2026-09-04):

SoftNavigationEntry (entryType: "soft-navigation")

Emitted when all three heuristic criteria are met. Key fields:

• navigationId — unique ID linking all metric entries to this soft navigation
• interactionId — links to the interaction that triggered the navigation
• name — the new URL
• startTime — when the interaction was detected
• paintTime / presentationTime — FCP equivalent for this route
• getLargestInteractionContentfulPaint() — method to derive soft-nav LCP

InteractionContentfulPaint (entryType: "interaction-contentful-paint")

Emitted after any interaction that causes a contentful paint. Matched to a soft navigation via interactionId. Used to derive LCP for the route.

Feature detection

// Before attaching observers:
PerformanceObserver.supportedEntryTypes.includes('soft-navigation')
// or:
'SoftNavigationEntry' in window

(Chrome for Developers, 2026-09-02; Apogee Watcher, 2026-07-28)

---

How Core Web Vitals are measured per soft navigation

All timings are relative to the original hard-navigation start; soft-nav values must subtract the soft-navigation entry's startTime to get per-route timings. (Chrome for Developers, 2026-09-02; DebugBear, updated 2026-08-27)

Metric	How it's measured for soft navigations
LCP	Via InteractionContentfulPaint entries whose interactionId matches the soft navigation. Hard-navigation largest-contentful-paint entries are unaffected.
CLS	layout-shift entries sliced by the soft-navigation timing boundaries.
INP	event entries sliced by soft-navigation boundaries; reset to 0 for each new route.
FCP	paintTime / presentationTime on the SoftNavigationEntry.
TTFB	Reported as 0 (no server round-trip for a client-side navigation).

Important: content persisting between routes is excluded from LCP

Soft-navigation LCP only considers new paints tied to the interaction. If a large banner image was already rendered in a previous route and is still in view, it is not a LCP candidate for the new route. This means: a deep-link cold load and an in-app soft navigation to the same URL may report different LCP elements. PDPs reached from a listing page may show lower LCP than the same PDP loaded cold. (Chrome for Developers, 2026-09-02; web.dev SPA FAQ, 2026-08-11)

---

Tooling support (as-of 2026-09-09)

web-vitals JS library v6

Google's web-vitals library v6.0.0 (released July 21, 2026) added opt-in soft navigation reporting via reportSoftNavs: true on onLCP, onCLS, onINP, etc. Without that option, the library reports metrics for the initial hard navigation only — matching current Chrome User Experience Report (CrUX) behaviour. v6.0.1 (July 27, 2026) added a guard for environments without PerformanceObserver. (Chrome for Developers, 2026-09-02; CSS Wizardry, August 2026)

Upgrade risk: CSS Wizardry (Harry Roberts, August 2026) flags that migrating RUM from web-vitals v5 to v6 is not a drop-in replacement:

• A single document now produces several metric lifecycles (one per route)
• RUM tools may double-count if they already fire proprietary virtual-page events alongside Chrome's native soft navigation events
• A one-second idle cap in v6 allows previously-unreported busy sessions into the dataset — this can make a percentile look worse when coverage has actually improved, not the app
• INP attribution may cross route boundaries differently than before
• Recommended approach: run v5 and v6 in parallel and compare reporting rate, metric completion, route detection, and bfcache population before cutting over headline percentiles

Chrome DevTools (as-of 2026-09-09)

• Performance panel traces show soft navigation markers with asterisk (e.g. Nav*, LCP*) from Chrome 145 onward
• Chrome 152 Beta adds soft-nav Core Web Vitals to Live Metrics view by default, powered by web-vitals v6 (Apogee Watcher, 2026-07-28 / updated 2026-08-26; Chrome for Developers, 2026-09-02)

---

CrUX integration and ranking impact (as-of 2026-09-09)

Critical for ecommerce PMs: soft navigations are NOT yet in CrUX and do NOT affect Google Search ranking.

As of September 2026, Google has not published a timeline or methodology for integrating soft navigations into Chrome User Experience Report (CrUX). The Chrome for Developers documentation (updated 2026-09-02) states: "How exactly soft navigations will be reported in CrUX, once the feature is launched, is also still to be determined. We will announce how CrUX will change when we have more to share here." The web.dev SPA FAQ (updated 2026-08-11) confirms: "Chrome has not yet published timeframes of integrating these into the Chrome User Experience Report (CrUX)."

Because Google's ranking page-experience signal draws exclusively from CrUX, soft navigations have zero SEO / ranking impact as of this writing. CrUX continues to measure only hard (document) navigations. (DebugBear, 2026-08-27; web.dev SPA FAQ, 2026-08-11)

---

Specification status

The Soft Navigations specification is a WICG draft published at https://wicg.github.io/soft-navigations/. It has not been adopted as an official W3C standard. A shipped Chrome implementation does not mean the specification is finished — details can still change based on real-world data. (DebugBear, 2026-08-27; WICG GitHub)

---

Data layer timing risk for analytics

A senior web analytics engineer (Dmitrijs Gizdevans, Medium, April 2026) identified a production-quality risk for ecommerce RUM and analytics stacks:

• The Soft Navigations API fires based on browser heuristics, not data-layer updates. It can fire before the data layer is updated with the new page context.
• This means soft navigation events may carry stale metadata (wrong page_type, missing product_id, absent checkout_step) if the data layer populates after the paint.
• Sites already firing router-based virtual pageviews face duplicate event risk if they add soft navigation listeners without deduplication logic.
• The API does not handle consent — consent gate logic must be applied separately.
• The author's framing: "This is a detection signal, not a tracking solution" — it validates that a navigation occurred but does not close data layer timing or business-context gaps.

(Medium — Dmitrijs Gizdevans, April 28, 2026)

---

Framework-level bugs (as-of 2026-09-09)

Next.js Pages Router — GitHub issue #79800 (May 28, 2025): useReportWebVitals in Next.js Pages Router fires duplicate CWV metrics on soft navigations (duplicate LCP, TTFB). App Router behaves as expected. Soft navigation CWV measurement was experimental at time of filing; status not confirmed resolved. (GitHub, vercel/next.js#79800, 2025-05-28)

Sentry — GitHub issue #17857 (October 3, 2025): Sentry's SDK collects web vitals via the web-vitals npm package, which did not model SPA soft navigations well. Sentry was tracking Chrome's experimental support and waiting for web-vitals library stability before building their own implementation. (GitHub, getsentry/sentry-javascript#17857, 2025-10-03)

---

Retailer / ecommerce case studies (as-of 2026-09-09)

None published. The API shipped in stable form in July 2026; no retailer case studies or published ecommerce implementations were found across web, Reddit, or YouTube searches. RUM vendors are described as still aligning their implementations to the shipped API shape. This is an expected research gap — check again in Q1 2027.

---

What practitioners report (conference talks)

Michal Mocny (Google Chrome team, primary API engineer) — performance.now() 2025 (Amsterdam, Oct–Nov 2025):

• The line between MPA and SPA is increasingly blurred; neither architecture is inherently superior for Core Web Vitals
• Soft navigations will be added to PerformanceObserver entry types (talk predates Chrome 151 stable)
• INP for a soft navigation includes the click that exits the previous soft page (unload handling counts)
• Soft-nav LCP is measured similarly to hard-navigation LCP, including unload handling on the previous soft page
• LCP for pre-rendered pages (via Speculation Rules) can appear artificially high because start time is set at request time, not when the user actually navigates (YouTube, performance.now() 2025, https://www.youtube.com/watch?v=sDHSn-OryV8)

Harry Roberts (CSS Wizardry) — performance.now() 2024 (Amsterdam, Nov 14–15, 2024):

• "Soft navigations need different tactics. Needs clicks, not navigations" (conference notes, performance.now() 2024 playlist)

---

Key terms

Term	Meaning
Soft navigation	A client-side route transition detected by Chrome's three-criteria heuristic
Hard navigation	A traditional document navigation (full page load / HTML document request)
SoftNavigationEntry	New PerformanceEntry type emitted when a soft navigation is detected
InteractionContentfulPaint	New PerformanceEntry type linking a user interaction to the resulting LCP
navigationId	ID attribute added to all performance entries to attribute them to a specific navigation
WICG	Web Platform Incubator Community Group — where specs are incubated before W3C standardisation
CrUX	Chrome User Experience Report (CrUX) — the field data source for Google's ranking signal

---

Next frontier

TTFB · Total Blocking Time (TBT) · LightWallet · ISR (Incremental Static Regeneration) · Zero-Click Search · AI Mode (Google) · Shopping Graph