Making an Observable notebook an installable offline PWA

Hi! I’m thinking about how feasible “add to homescreen” for notebooks is. I don’t have much experience with progressive web apps, but it seems like the main tasks are to

  1. show the browser a manifest file (as described here) and to

  2. capture and cache require/import requests via the service worker cache api (described here).

At present, for (1), using a data URI inside a manifest element inside a cell doesn’t seem to work since things are in an iframe. (2) seems hard to do for an arbitrary notebook–you’d basically have to insert custom code into require or import to handle caching.

I was hoping to set up a notebook or external webpage that can do this, but maybe I should let it go for now?

I was able to set up an Android-installable notebook via a Github-hosted tool I use for displaying notebooks statically (example uses an external manifest file; installation is Firefox-only because service workers aren’t set up), but I don’t know how to handle caching, so it won’t work offline.

4 Likes