Bug 209961

Summary:	request gets fetched from memory cache instead of service worker after second refresh
Product:	WebKit	Reporter:	Giorgi <giorgi.lagidze>
Component:	Service Workers	Assignee:	Nobody <webkit-unassigned>
Status:	NEW ---
Severity:	Critical	CC:	cdumez, webkit-bug-importer, youennf
Priority:	P2	Keywords:	InRadar
Version:	Safari 13
Hardware:	Mac
OS:	All

Description Giorgi 2020-04-03 06:27:45 PDT

Here is the detail of my observation. 

Let's look at this scenario:

I went to the page for the first time, service worker's install event gets called and things get precached from there (I checked and they are precached). Now, I refreshed the page and looking at network tab, requests all get returned from Service Worker in transfer column. Now, I refresh Again and it looks like some of those files, I'd say 80% gets returned from memory cache (that's what network's transfer size column says in safari. I am wondering why they get returned from memory cache after 2 refreshes? It seems like that now, I get an assumption that i can't full control some requests via service worker. First, I was thinking maybe safari browser's transfer column size shows wrong information, but I tried to test it like this:

I registered fetch listener and put console.log(e.request.url) there. After I refresh my website 2 times where transfer column shows that items get returned from memory cache, it seems like fetch listener doesn't get called for those urls that get brought from memory which makes my point that some of the urls don't get controlled after 2 refreshes and they keep coming back from memory cache. On chrome, this behaviour doesn't happen. What could be the case? This doesn't happen on chrome at all on android or normal pc (not mac). They all get fetched from service worker any time i refresh the page.

Comment 1 Radar WebKit Bug Importer 2020-04-04 13:04:32 PDT

<rdar://problem/61301444>

Comment 2 youenn fablet 2020-04-04 13:36:15 PDT

Hi Giorgi,

Your observations are probably correct.

The typical load flow is:
Web page start a load -> Memory Cache check -> Service Worker Check -> Network Cache check -> Network load.

If there are important resources you want to always return from service worker, the best way to do it would be to use Cache-Control on the response returned by the service worker since the Memory Cache will use these.

Note that the memory cache improves the page load since the resources are in process and some of the resources are pre-processed for faster reuse like images.

Would you be able to describe more precisely the issues this behavior might cause?

Comment 3 Giorgi 2020-04-04 13:39:02 PDT

Question 1)

It's really interesting why the same thing doesn't happen on chrome and what's the reason they decided not to use this flow. Of course, they use memory cache but if there's service worker in play, service worker starts to be in full control and assets don't get returned from memory cache in this case. 



Question 2)

Exactly which Cache-Control attribute would you use in this case ?

Comment 4 youenn fablet 2020-04-04 13:45:57 PDT

(In reply to Giorgi from comment #3)
> Question 1)
> 
> It's really interesting why the same thing doesn't happen on chrome and
> what's the reason they decided not to use this flow. Of course, they use
> memory cache but if there's service worker in play, service worker starts to
> be in full control and assets don't get returned from memory cache in this
> case. 

Memory cache is not yet standardised so it is not surprising to see differences in that area.

> Question 2)
> 
> Exactly which Cache-Control attribute would you use in this case ?

I would probably use something like must-revalidate.
The service worker would always get the request.
The service worker could return a 304 to make use of the memory cache entry.