Soft Navigations: Measuring Core Web Vitals in SPAs
Single-page apps only report the first load to CrUX. How the Soft Navigations API from Chrome 151 measures route changes and splits LCP, INP and CLS per route.
Without reliable measurement, optimisation becomes guesswork. This category explains the metrics Google uses for user experience — Largest Contentful Paint, Interaction to Next Paint and Cumulative Layout Shift — and how they come about. We show the difference between lab data and field data from real visits, explain percentiles and why an average misleads, and describe how to set up measurements realistically on mobile connections. Added to this are debugging approaches: reading waterfall charts, spotting main-thread blocking, tracing layout shifts and documenting results so improvements remain provable over time. We additionally show how to automate measurements so that regressions after a release are noticed immediately rather than weeks later.
Single-page apps only report the first load to CrUX. How the Soft Navigations API from Chrome 151 measures route changes and splits LCP, INP and CLS per route.
Reduce DOM size: cut style and layout work with pagination, virtualization, content-visibility and flatter markup to improve INP and Core Web Vitals.
How throttled CPU, slow networks, viewport and touch shift mobile Core Web Vitals and which levers speed up your shop on the phone where revenue happens.
Optimizing INP: how to bring Interaction to Next Paint below 200 milliseconds. Targeted relief for long tasks, event handlers and third-party scripts.
How to read a Lighthouse report correctly: which five metrics weight the score, why opportunities act indirectly and how to prioritize by estimated savings.