Scipion
Scipion

Reputation: 11888

Angular service worker leads to calls happening twice

I have just installed Angular cli's service worker by following :

https://medium.com/@amcdnl/service-worker-pwas-with-the-angular-cli-98a8f16d62d6

I have changed anything anywhere, and thus my conf should be standard. I can see my static resources getting served from my service worker. However what struck is that some are done twice (by instance inline.bundle.js is)

inline.bundle.js from network tab

I am slightly confused by the interface here, the request isn't actually done twice right ?

Upvotes: 1

Views: 2158

Answers (1)

pate
pate

Reputation: 5263

That seems normal depending on the way the Service Worker is configured.

What most likely happens here is:

  • SW caches something
  • Next time SW responds with the cached asset
  • After responding with the cached asset, SW checks the file from the server to see if it has changed
  • If the asset has changed on the server, SW replaces the cached version with the new version

This leads to the network panel showing "two requests" for the same file. If you look at the network panel, the small icon on the left on the second request means that "this request was initiated from the Service Worker". That icon tells you that it was the SW that wanted something from the network.

This might not be optimal, though. In your case the asset file name is a hash of this or that so every time you make a change in your code and release a new version of the website, the file name changes. When the file name changes, the SW should not have any reason to consult the network for updated file contents. If the name changes, it's a new file; if not, nothing has changed. But this is SW framework/library/whatever specific and I'm not sure how to configure this in your case. Just something to understand in the bigger picture.

Upvotes: 3

Related Questions