Viewing Installed Service Workers

[00:00:00]
>> Just to understand service worker, something that you can try right now. If you open Google Chrome on android or desktop, is not gonna work on iOS because, remember, Chrome on iOS is not actually Chrome. It works also with Edge as well. You can go to chrome://serviceworker-internals. In Elvish, it's actually Elvish serviceworker-internals.

[00:00:29]
This is like a page where you can actually debug and see all the service workers that are currently installed in your machine and you didn't know that. So you're going to find probably hundreds of service workers. And you did know, for example, here I can see that I have the starbucks.com service worker.

[00:00:54]
Remember you don't need to install an app, the PWA, to actually get a service worker. So the ServiceWorker registration and life-cycle, it goes completely separated from the installation of the icon. So we can use the service worker even in the browser, okay, so we just work. So, when you get into the website, just navigate into the URL of the service worker that we will register.

[00:01:21]
And then that service worker can have some abilities, such as cashing files or downloading files. So, for example, here I can take the app starbucks.com scope. Here you can see the JavaScript file. So you can actually go on and open that URL in case you wanna see the file.

[00:01:41]
So it's JavaScript, okay, so everything is public. And something that you're going to see here is that it has an installation status and a running status. Right now it's activated. Activated means that this is the active service worker for the scope. So if anyone from that scope, so from this URL, wants to make a HTTP request, the active service worker, so this file can actually be executed and run some code.

[00:02:18]
But it's currently stopped, so it's not executing code. Let me show you something, I'm going to create a new Chrome window here, I'm going to move it like that. And I'm going to load app starbucks.com/, no, I-don't-like-coffee, that's not true but anyway. So, of course, that's a URL that doesn't exist on Starbucks server.

[00:02:46]
But pay attention to what happens with the running status of our service worker. Now it says running. So even a 404, because actually no one knows beforehand that is going to be a 404. So it runs the Starbucks ServiceWorker, so now it's running. So now it has its own thread.

[00:03:09]
You can execute code for how long? Let me close that window. So most of you are expecting the running status to go back to stop. So it's not actually tied to the browser's tab or to the PWA that actually opens that service worker. For how much time it will be running?

[00:03:34]
It depends on the browser. Typically, in Chrome, it's 40 seconds. And now you can see it's stopped. So after 40 seconds of inactivity, the service worker goes back to stop. And it will wait until an event will fire another running. Okay, it doesn't make sense? So it has a completely separate life cycle from the tab and if you open more than one tab it's going to share the instance.

[00:04:02]
So you won't have more than one instance of the same service worker in memory at once. So if you have two, three, four tabs or two, three, four PWAs running the same or Elvishing, you would have only one service worker and that service worker will have different clients.

[00:04:22]
That's the word that we are using here. We have one service worker, different clients. Each browser's tab can be a client. Each PWA standalone instance can be a client. An iFrame can also be a client. Also from this URL, you can force starting a service worker even if you don't have any client.

[00:04:44]
You can stop it and also you can inspect the service worker. So in this case, and this is important, the ServiceWorker is completely detached from the user interface, so there are no elements. And if you go to the console, you can see I'm in the ServiceWorkerGlobalScope. And if I tried to make an alert like, hello, it doesn't work because we do not have an alert, actually.

[00:05:12]
So because we are not in the user interface, we are in a different thread, this is not the main thread, okay? That's the idea of a service worker for now.