Journal

As expected, there was no notification in my installed app when the updates were pushed out, so I need to dig into this sw.update event triggered by the jekyll-pwa-plugin. First up, I needed to learn about events and how to use them. Implementing this, I was able to get a simple alert box to display while navigating the site after an update. It’s not the most elegant solution, but it works! The alert box was changed to a confirm box, and confirming refreshes the page. I am curious if, on opening the web app, it will pop up immediately, or if I will have to navigate to a page before it will prompt for updates. While scrolling through other references, I stumbled across this blog about implementing browser notifications, and playing around with that in conjunction with the sw.update event yielded improved results.

I spent some time rearranging the functions, testing different types and conditions of notifications, and trying to make the notifications more informative than just “hey, please refresh!” Visibility state conditions were interesting to work with, and it was incredibly satisfying to:

  1. Tab away from the site
  2. Right-click and refresh my site without making the tab active
  3. Get the notification with this post title
  4. Click on the notification
  5. And have the tab become active and switch to the latest post!

I am curious to see if this is enough to start getting proper updates on my web apps, but I suspect that it’s still not there yet. Either way, this as been a fun experiment. There is a lot to learn about service workers and making all of this work. Probably more than I should really look into right now, as I’ve already trudged much further into the weeds than I should have. Here are a few other posts that I read through, but would like to revisit later:

Today ended up being a pretty jam-packed day, so I didn’t get to much else on the coding front. I hope to get that references list page done soon!

Tasklist

  • => Add some way to see a list of all references used across the entire site
  • Implement a simple alert when new content is delivered