Performance

Performance is what makes a PWA feel app-like rather than web-like. Core Web Vitals quantify the experience (load, responsiveness, and visual stability), while platform primitives like View Transitions and Speculation Rules let a PWA animate between views and pre-render likely next pages. Service-worker caching turns repeat visits into instant loads.

These entries cover the metrics, their thresholds, and the levers that move them.

In this section

Core Web Vitals (LCP, INP, and CLS)What LCP, INP, and CLS measure, the 2.5 s, 200 ms, and 0.1 thresholds at the 75th percentile, which engines expose each entry, and the levers a PWA has.

View Transitions APIHow document.startViewTransition() snapshots the DOM and animates to the new state, the ViewTransition promises, the @view-transition rule, and engine support.

Speculation Rules APIThe speculationrules JSON that asks the browser to prefetch or prerender likely next pages, its eagerness levels, Chrome's limits, and Chromium-only support.

The app shell modelHow the app shell architecture separates the precached UI chrome from per-route content, the cache cleanup it needs, and its trade-off against server rendering.

Back/forward cache (bfcache)How the back/forward cache restores a whole page from memory, which listeners and headers make a page ineligible, and how notRestoredReasons reports why.

Code splitting with dynamic import()How dynamic import() splits a PWA's JavaScript into chunks loaded on demand, what route, component, and vendor splits save, and where import() is forbidden.

Font and image optimizationHow font-display and size-adjust control text during a font load, how loading, fetchpriority, and picture control image fetches, and AVIF and WebP support.

Lighthouse and the removed PWA categoryWhat Lighthouse audits, why Lighthouse 12.0 in Chrome 126 removed the PWA category after Chrome changed its installability criteria, and what to use instead.

Navigation preload and service worker boot timeWhy a service worker's boot time adds to Time to First Byte on navigations, how navigation preload overlaps the request with it, and when it does not help.

Precaching strategiesHow precaching fills Cache Storage with a build-time list of shell assets at install, why each entry needs a revision or hashed URL, and how Workbox does it.

Resource hints (preload and preconnect)What link rel=preload, preconnect, modulepreload, and prefetch each start early, the as and crossorigin rules that avoid a double fetch, and Chrome's warning.

PerformanceObserver and paint timingHow PerformanceObserver delivers paint, largest-contentful-paint, and navigation entries, which engines report which, and what buffered and workerStart mean.

← Back to the Reference overview.