Free tool
Service worker generator
Pick your caching strategy. We emit a small, dependency-free sw.js that ships to production today. Serve it from the site root.
// Generated by instantpwa.com/tools/service-worker-generator
const CACHE = 'v1';
const SHELL = ['/', '/manifest.webmanifest'];
self.addEventListener('install', (e) => {
e.waitUntil(caches.open(CACHE).then((c) => c.addAll(SHELL)));
self.skipWaiting();
});
self.addEventListener('activate', (e) => {
e.waitUntil(caches.keys().then((keys) => Promise.all(keys.filter((k) => k !== CACHE).map((k) => caches.delete(k)))));
self.clients.claim();
});
self.addEventListener('fetch', (e) => {
if (e.request.method !== 'GET') return;
e.respondWith(
caches.match(e.request).then((cached) => {
const fresh = fetch(e.request).then((res) => {
const copy = res.clone();
caches.open(CACHE).then((c) => c.put(e.request, copy));
return res;
}).catch(() => cached);
return cached || fresh;
})
);
});FAQ
Where does the file go?
At the site root, e.g. /sw.js. Register from your entry: navigator.serviceWorker.register("/sw.js").
Do I need Workbox?
Only once you need three or more caching strategies or precache manifests generated at build.
Ship a real install popup in 60 seconds
InstantPWA is one line of code. Free forever for one popup.
Get started free