search

GoogleChromeLabs / quicklink

⚡️Faster subsequent page-loads by prefetching in-viewport links during idle time
https://getquick.link
Apache License 2.0
11.02k stars 404 forks source link

[Question] Using quicklink as a Service Worker cache warmer? #97

Closed willstocks closed 4 years ago

willstocks commented 5 years ago

Hey guys,

Quick question... could quicklink be used as a cache-warmer for a service worker, and if so how would one do this in a "simple" manner (sw caching is a little new to me!).

I know quicklink obviously loads stuff into the browser cache for next page load, but could I also load the loaded pages into my service worker cache, as it'll then also mean the pages will be (relatively) usable/revisitable offline. At the moment, it seems to not load quicklink loaded pages into my sw cache?

MrPaulDriver commented 5 years ago

I have been asking myself the same question

addyosmani commented 5 years ago

It's timely that there's interest in this. I've heard elsewhere there's demand for demonstrating how to use Quicklink and Service Workers together.

The approach I would probably take is passing the URLs we collect for what is in-viewport/matched and pass that to SW to tackle precaching rather than using our default prefetching logic.

I think it's worth putting together an example for how to achieve this using Workbox. Currently thinking this may make sense as a Workbox plugin.

demianrenzulli commented 4 years ago

Hi folks,

Some time has passed since this question was asked, but, just in case here's some clarifications around quicklink and service workers (we are thinking on an article to complement prefetching techniques with service workers):

  1. For precaching purposes, I don't think quicklink has much to do, but the library can work well with service workers in runtime caching scenarios (please, refer to the linked articles to see the difference).

  2. The next question is: which runtime caching strategy would play well with quicklink? By default, prefetch resources are kept in the prefetch cache for 5 minutes, after which the cache-control rules apply. If you want to extend the lifetime of the prefetched resource, you can use a staleWhileRevalidate() strategy in the SW. That way, the next request for the resource can be served very fast from the SW cache, while the resource is updated in the background.

  3. Fortunately, there's now a Workbox demo that implements the previous technique, you can check here.

  4. There's one more advanced scenario, that can be explored with caution: since the service worker will intercept request for documents to prefetch, you could go beyond this point, by parsing the document in the SW, and fetching resources that this document would eventually request. If you implement this along with the default behavior of quicklink, do it with caution or you'll end up prefetching too many things.

As said, we are planning to work on some kind of article to document this patterns better. Hope this clarifies this question!