How we architect a progressive web app
A solid PWA starts as a fast, server-rendered website, so content loads quickly and search engines can read it. On top of that, a service worker, usually generated with Workbox, caches the app shell and static assets and applies a deliberate strategy per route: cache first for fonts and images, network first for prices and stock, and stale while revalidate for content that can be slightly out of date.
Data that must work offline lives in IndexedDB, with a queue of pending actions such as form submissions or orders that sync when the connection returns. The web app manifest defines the name, icons, theme and display mode for installation, and web push uses standard VAPID keys with a backend service that stores subscriptions per user and device.
Updates need care. When a new version is deployed, the new service worker waits until the user reloads, so we show a gentle prompt to refresh and make sure old caches are cleaned up. Testing the update path is as important as testing the first install.
- Server rendering or static generation for fast first loads.
- Explicit caching strategy for every route and asset type.
- Offline queue for user actions with clear sync status.
- Update prompts and cache cleanup on every release.
