feat(pwa): implement precache

[charlesrocket]

Without network information for now.

[netlify]

✅ Deploy Preview for halve-z ready!

Name	Link
🔨 Latest commit	c49aa69
🔍 Latest deploy log	https://app.netlify.com/sites/halve-z/deploys/660a03b676200c0008d577a6
😎 Deploy Preview	https://deploy-preview-24--halve-z.netlify.app
📱 Preview on mobile	Toggle QR Code... Use your smartphone camera to open QR code link.

---

To edit notification comments on pull requests, go to your Netlify site configuration.

[charlesrocket]

Cache size is good.

[Jieiku]

Awesome, I see how you did that too, I had not considered that approach because I thought I needed to pass all documents, and figured the list would be too big.

EDIT:
I cannot tell if it is working on the demo, it does not seem to be.

I opened chrome on my android device and visited https://halve-z.netlify.app I then waited 10 seconds which should be plenty of time for the service worker to download assets, and then disabled the data and wifi on my phone. none of the pages like posts or code load, it just shows Offline Mode, no cache/page found.

I did look at the code and see the intended implementation though, and have done similar things, it does look like it should be working at first glance.

[charlesrocket]

@Jieiku Yeah it kicks in only after the activation check. I moved it with this commit 820b25d

[Jieiku]

Works now for me, I can navigate between the Home, Posts, and Code Pages. I can also browse any of the articles!

One thing I really like about the PWA approach in addition to being able to use my site while offline, is that page navigation is instantaneous, heavy bloated sites would never want to use this approach, especially with lots of content, but with these lightweight zola generated static sites the user experience is really improved when everything is cached, all navigation is instantaneous!

[charlesrocket]

@Jieiku Swell! For heavy sites, it would definitely be a drag, true. For such cases, maybe precache critical assets only and prefetch images, etc., depending on head conditionals?

[Jieiku]

yeah, that sounds about right to me, when I was reading about service workers and PWA's, one idea was to have the service worker cache the pages that are linked on a given page in addition to critical assets, that was as you browse any link you could possibly click on that page would get pre-cached. (assuming it is on the same domain)

For my own personal site, I like the entire thing cached, I think even with 100s of articles my site would still be pretty light!

[charlesrocket]

@Jieiku text assets for the win! It might get out of hands in my case—some images are big, though this could be resolved with the zola image processor.

[charlesrocket]

Dynamic cache worked flawlessly, until I started implementing paginators (#26). I need a break...