|
Hey all! Does anyone have an example project or some information on how to turn existing tanstack/router + tanstack/query application into Progressive Web Application. I understand that for the query part, one needs to change the default |
Replies: 2 comments
|
I have one here: https://github.com/LinkdJulioFlores/LinkdJulioFlores-tanstack-start-offline-first-pwa |
|
The service worker usually does not need to know about TanStack Router specifically. Treat it as two layers: the service worker caches the app shell/static assets and provides a navigation fallback, while TanStack Query owns the data cache/offline behavior. For the query side, use networkMode: offlineFirst, a persisted Query cache, and IndexedDB for non-trivial data. Router loaders can call queryClient.ensureQueryData(...), but the offline guarantee comes from prefetching the needed queries while online and persisting the Query cache; the router just reads from that cache when the route is visited offline. |
The service worker usually does not need to know about TanStack Router specifically. Treat it as two layers: the service worker caches the app shell/static assets and provides a navigation fallback, while TanStack Query owns the data cache/offline behavior.
For the query side, use networkMode: offlineFirst, a persisted Query cache, and IndexedDB for non-trivial data. Router loaders can call queryClient.ensureQueryData(...), but the offline guarantee comes from prefetching the needed queries while online and persisting the Query cache; the router just reads from that cache when the route is visited offline.