import {RouteHandlerCallbackOptions} from 'workbox-core/types'; import {CacheFirst, NetworkFirst} from 'workbox-strategies'; import {registerRoute} from 'workbox-routing'; // Borrowed from https://developers.google.com/web/fundamentals/instant-and-offline/offline-cookbook#cache-and-network-race function promiseAny(promises: Array>): Promise { return new Promise((resolve, reject) => { promises = promises.map(p => Promise.resolve(p)); promises.forEach(p => p.then(resolve)); promises.reduce((a, b) => a.catch(() => b)) .catch(() => reject(Error('Unable get a response from network or cache.'))); }); }; const cacheName = 'my-cache'; const networkFirst = new NetworkFirst({cacheName}); const cacheOnly = new CacheOnly({cacheName}); const cacheNetworkRaceHandler = async (options: RouteHandlerCallbackOptions) => { return promiseAny([ networkFirst.handle(options), cacheOnly.handle(options), ]); }; registerRoute( // Use whatever matchCallback criteria you want. ({url}) => url.pathname.includes('/foo/bar'), cacheNetworkRaceHandler );