Exploring Service Workers

Keeping the Service Worker Alive

Kyle Simpson

Kyle Simpson

You Don't Know JS
Exploring Service Workers

Check out a free preview of the full Exploring Service Workers course

The "Keeping the Service Worker Alive" Lesson is part of the full, Exploring Service Workers course featured in this preview video. Here's what you'd learn in this lesson:

Kyle introduces the waitUntil method, a way to tell the browser not to shut down, and gives an example of a situation where allowing the service worker to continue to run is useful.


Transcript from the "Keeping the Service Worker Alive" Lesson

>> Kyle Simpson: The onActivate is potentially, well actually, definitely in our case, it's gonna do some work, and it's gonna do some asynchronous work. And there is a concept you need to be aware of with service workers that when they get into these phases, if you are not careful you may have some stuff that's happening when the browser decides, you know what, I'm gonna shut this thing down.

So there's a way for you to tell the browser, I'm still doing stuff, don't shut down. It's not a guarantee, but it's a really strong request to the browser, I'm still doing important stuff, please don't shut me down. And the way you do that is a method that's been added to these special event objects.

It's called waitUntil, so you're telling the browser wait until something. And the thing that you're gonna pass to it is a promise. So I'm gonna make another function called handleActivation, which is gonna do a bunch of work, and this is theoretically then gonna tell the browser, even if that work is still happening when you would normally shut down the service worker please let that work keep going.

So how this might play out might be that a user bounces onto your site, and then you start downloading a bunch of content into their cache, and then they leave. Do you want for the cache to be partially filled? Probably not. You can gracefully handle that and we're gonna be dealing with strategies where the cache, we're checking each item to see if it's in the cache, but you probably don't want things in an inconsistent state.

So here you're basically saying, don't shut my service worker down until I'm done loading up all my cache stuff. In which case it might run for another minute or two in the background while it's getting all that information. It's not a guarantee because if you're going way too long, eventually the browser 's probably is going to say

>> [SOUND]
>> Kyle Simpson: You're dead, but It's gonna allow it to stay open longer than it might otherwise. Okay. So what's that handleActivation function gonna look like?

Learn Straight from the Experts Who Shape the Modern Web

  • In-depth Courses
  • Industry Leading Experts
  • Learning Paths
  • Live Interactive Workshops
Get Unlimited Access Now