PerformanceSoftNavigation
The PerformanceSoftNavigation interface provides timing information about soft navigations as used by client-side routing on single-page application (SPA) sites. It is emitted when a browser observes a soft navigation to have taken place.
Instance properties
This interface directly defines the following properties:
-
The id of the interaction that resulted in the soft navigation.
-
The id of the navigation, unique to this page load.
-
The type of the navigation.
-
Returns the
timestampof when the first rendering phase ended and the paint phase started. -
Returns the
timestampof when the first painted pixels were actually drawn on the screen.
It also extends the following PerformanceEntry properties, qualifying and constraining them as described:
PerformanceEntry.entryTypeRead only-
Returns
"soft-navigation". PerformanceEntry.durationRead only-
Returns the result of
PerformanceSoftNavigation.presentationTime-PerformanceEntry.startTime. PerformanceEntry.nameRead only-
The new URL navigated to.
PerformanceEntry.startTimeRead only-
Returns the
timestampof the interaction that resulted in the soft navigation.
Instance methods
This interface also inherits methods from PerformanceEntry.
-
Returns the current largest
InteractionContentfulPaintfor this soft navigation.
Description
The PerformanceSoftNavigation interface is driven by the browser observing the following:
- A trusted user interaction.
- A visible, contentful paint as a result of that interaction updating the screen.
- A URL update in the user's address bar as a result of that interaction.
Having the browser provide this rather than a routing framework calling an API to emit this entry allows SPA performance timing to be measured consistently regardless of how different applications handle navigations (for example, updating the URL at the start or the end of navigation processing).
The PerformanceSoftNavigation interface allows developers to measure SPA performance metrics such as:
- First Contentful Paint (FCP): Can be measured as the first paint from the soft navigation time.
- Largest Contentful Paint (LCP): Can be measured via the
InteractionContentfulPaintfor the soft navigation. - Cumulative Layout Shift (CLS): Can be calculated between navigations.
- Interaction to Next Paint (INP): Can be calculated between navigations.
Examples
>Observing soft navigations
In the following example, a PerformanceObserver is used to log the soft navigations. The buffered flag is used to access data from before observer creation.
const observer = new PerformanceObserver((list) => {
for (const entry of list.getEntries()) {
console.log("Soft Nav:", entry.startTime, entry.name);
}
});
observer.observe({ type: "soft-navigation", buffered: true });
Specifications
This feature does not appear to be defined in any specification.>Browser compatibility
See also
- Measuring soft navigations on developer.chrome.com (2026)