Migrate from a native app to a PWA
Published
In one line: A Progressive Web App (PWA) is an application built using web technologies that provides a user experience similar to that of a platform-specific app. This guide covers two of its foundational pieces: the Web App Manifest, which supplies the metadata a browser needs to install the app, and the Service Worker, which can intercept requests to implement offline behaviour.
Where it is supported
Section titled “Where it is supported”Both pieces are gated by real browser support, not universal: consult the Manifest and Service Worker compatibility entries for the current per-browser, per-OS position before committing to a migration timeline — support differs enough between engines that “PWA” is not a single yes/no feature.
How to use it
Section titled “How to use it”A minimal manifest supplies the metadata a browser uses when installing the app:
{ "name": "My Migrated App", "short_name": "MyApp", "start_url": "/", "display": "standalone", "icons": [{ "src": "/icon-512.png", "sizes": "512x512", "type": "image/png" }]}A service worker is registered from the page and then runs separately from it:
if ('serviceWorker' in navigator) { navigator.serviceWorker.register('/sw.js');}How to detect it at runtime
Section titled “How to detect it at runtime”Feature-detect service worker support before relying on it, and give the reader a working page when support is absent rather than a silent failure:
function supportsServiceWorker() { if ('serviceWorker' in navigator) { return true; } // Fallback: no Service Worker support — the page still loads and functions // normally, just without the offline behaviour a service worker can add. return false;}Practical checklist
Section titled “Practical checklist”- Do not assume every native capability has a direct browser equivalent — check what the target browsers actually expose using the compatibility entries linked above before committing to a scope.
- Treat the manifest and service worker as two separate things to verify — do not assume support for one implies support for the other.
- Keep the migrated app usable when the service worker is absent or unregistered, using the feature-detection fallback shown above.
- Re-verify current support using the compatibility entries above before shipping, rather than relying on this guide’s snapshot.
Where to go next
Section titled “Where to go next”- Getting started — build and ship your first installable PWA.
- Offline strategies — pick a caching strategy once the service worker is registered.
- Service Worker compatibility — current per-browser support data.