0

I'd like to make a PWA available offline. It requires a large catalog (thousands) of small (2kb) files though. The total weight is ~ 15mb, which is reasonable if a user wants to install but too much to precache on first visit — and too much for WorkBox regardless (which seems to choke and die partway through an install).

Is there some (cross browser) mechanism wherein a set of files can be cached only after a user decides to add to home screen?

(window.onAppInstalled could be a solution for Chrome and FF but it doesn't work in Safari as far as I can tell.)

Ian
  • 592
  • 5
  • 21
  • Workbox provides a Cache Only strategy, but it is up to you to cache the files ([source](https://developers.google.com/web/tools/workbox/modules/workbox-strategies#cache_only)). Also, 15mb in a row is a bit harsh for the system to handle. Do you think Cache First is suitable, or does the user adding the app to his homescreen is not gonna access to the network? – Anwar Jun 25 '19 at 19:28
  • Yes, the user will want to use the app without network access after they install it—it may be the main reason they install it. The fact that WorkBox provides a Cache Only strategy is neither here or there because the problem is _when_ the cache is created in the first place. I understand that downloading 15mb of small files on first visit is not ideal and I can see it not working first hand—I don't want to do that. Ideally, the download would only happen if a user decides to install the web app, in which case a 15mb download is not a big ask to have something work offline. – Ian Jun 25 '19 at 20:26
  • I think you should try to provide a progressive option to deliver a such big payload, because for some browser this can go up the limit of available storage (source: this [StackOverflow response](https://stackoverflow.com/a/2989317/3753055)). If it is not business secret, try to tell us what is the full user experience, what is the context of your app. Maybe we could provide progressive alternative to download smaller chunks in a clever manner. – Anwar Jun 25 '19 at 20:50
  • I'm targeting contemporary devices that I'm expecting to have [20MB+ storage](https://love2dev.com/blog/what-is-the-service-worker-cache-storage-limit/). One use case is exploring a large but fixed set of assets/materials. If this information is not available offline, then that use case is nixed, which is 'ok'—no big deal—I can just communicate to the user the extent of offline site functionality and then dump everything in a native wrapper if they want that use case. An obvious web-centric approach would be nice but not necessary. So if the short answer is 'no', so be it. – Ian Jun 25 '19 at 21:41
  • 1
    Maybe I speculate, but if you manage somehow to understand the [Response](https://developer.mozilla.org/fr/docs/Web/API/Response) class in a way you can download one big chunk of 20Mb, then split it up in smaller response corresponding to every of your assets, storing them (as much as possible, some browsers will block up to a certain amount) in the CacheStorage, then you might reach your goal. Best I can help about this use case. – Anwar Jun 25 '19 at 21:47
  • Thanks! I’ll take a look! – Ian Jun 25 '19 at 22:18

0 Answers0