Manifests, service workers, caching strategies and when a PWA beats a native app

A progressive web app (PWA) is a web application built with standard web technologies that offers app-like capabilities: it can be installed on a home screen, work offline or on poor connections, load quickly and, in many cases, send push notifications. The term was coined in 2015 by Chrome developer Alex Russell and designer Frances Berriman.
PWAs are especially relevant in markets like India, where many users rely on budget phones, limited storage and patchy mobile data.
Service workers only run on secure origins, so the site must be served over HTTPS (localhost is allowed for development).
A JSON file that tells the browser how the app should look and behave when installed.
{
"name": "Example Store",
"short_name": "Store",
"start_url": "/?source=pwa",
"display": "standalone",
"background_color": "#ffffff",
"theme_color": "#0a5cff",
"icons": [
{ "src": "/icons/192.png", "sizes": "192x192", "type": "image/png" },
{ "src": "/icons/512.png", "sizes": "512x512", "type": "image/png" }
]
}Link it in the HTML head with <link rel="manifest" href="/manifest.webmanifest">.
A JavaScript file that runs in the background, separate from the page. It can intercept network requests, cache responses and handle push messages.
if ('serviceWorker' in navigator) {
navigator.serviceWorker.register('/sw.js');
}| Strategy | How it works | Best for |
|---|---|---|
| Cache first | Serve from cache, fall back to network | Fonts, icons, versioned assets |
| Network first | Try network, fall back to cache | News feeds, account pages |
| Stale-while-revalidate | Serve cache, update in background | Product listings, avatars |
| Network only | Always fetch fresh | Payments, real-time data |
| Cache only | Never hit network | Pre-cached app shell |
Libraries such as Workbox simplify implementing these patterns and managing cache versions.
Chromium-based browsers show install prompts when a site has a valid manifest and meets their criteria. On iOS and iPadOS, users add a PWA through Safari's Share → Add to Home Screen. Since iOS 16.4 (2023), installed web apps on iPhone can receive web push notifications after the user grants permission.
| Consideration | PWA | Native app |
|---|---|---|
| Development | One codebase for all platforms | Often separate iOS and Android code |
| Distribution | Via URL; optional store listing | App stores |
| Updates | Instant on next load | Store review and user update |
| Device features | Growing but limited on some platforms | Full access |
| Storage footprint | Small | Often large |
| Discoverability | Indexable by search engines | Store search |
PWAs suit content sites, e-commerce, booking and productivity tools. Native apps still win for demanding games, deep hardware integration and some background tasks.
A PWA is still a website, so standard SEO applies: server-render or pre-render important content, keep URLs crawlable and optimise Core Web Vitals. Aggressive caching must not serve stale prices or outdated legal information.
Yes, with some limitations compared with Android. Installation is through Safari's Add to Home Screen, and push notifications are supported for installed web apps from iOS 16.4.
Yes. PWAs can be packaged for the Google Play Store using Trusted Web Activities, and for the Microsoft Store.
It can dramatically speed up repeat visits, but a poorly configured cache can serve outdated content.
PWAs combine the reach of the web with many benefits of apps. For businesses serving users on varied devices and networks, a well-built PWA can deliver speed, reliability and engagement without the cost of multiple native apps.