search

icssc / AntAlmanac

A course exploration and scheduling tool for UCI Anteaters
https://antalmanac.com
MIT License
54 stars 64 forks source link

Make PWA work offline #863

Open EricPedley opened 7 months ago

EricPedley commented 7 months ago

RN we can download AntAlmanac as a PWA but it doesn't work offline. We can probably fix this by caching all the requests for the schedule and course info (don't quote me on this though, idk if this is the exact solution we need).

MinhxNguyen7 commented 4 months ago

@teresa-liang how's this looking? If you've started coding, can you put up a PR?

MinhxNguyen7 commented 3 months ago

@adcockdalton Can you put up some information about what the difficulties are so that we might help you/decide that it's not worth the trouble? @ap0nia to Vite + Turbo, I think, so he might be able to help.

adcockdalton commented 3 months ago

Of course,

so frameworks like Create-React-App have their own handlers (namely Workbox) for service workers, which are created behind-the-scenes with default functionality. This just caches the assets, however, unless you modify it. However, I was not even getting that functionality, so I assumed that functionality was lost with the migration to Vite (which I was only partially aware of--my fault on that).

But when I added a service worker manually and attempted to load a test component via the cache, I was able to get console to print "service worker registered" without errors but I got no functionality.

Which brings me to Vite, since it seems to have a plugin for PWA, meaning perhaps you have to use their package? However, I think we should still be able to add a service worker normally, so I'm not sure. https://vite-pwa-org.netlify.app/guide/register-service-worker

Once the service worker is confirmed to work for at least the assets, the task is writing logic to cache the data and refresh it when certain conditions are met (and provide layers of fallback). Assuming no technological hiccups, this should just be a series of relatively easy design choices.