服务工作者预加载的子页面pageloading

Question

我加入HTML码为ServiceWorker到HTML页与下面的代码后sideload更好的性能。这是我的代码，它工作正常：

self.addEventListener("install", function (e) { 
     e.waitUntil(
     caches.open("myCache").then(function (cache) { 
      return cache.addAll([ 
       "p1.html", 
       "p2.html"]); 
     }) 
    ); 
    }); 

但是，如果服务脚本可用，子页面会立即加载。在网络连接到gprs或边缘throtteling这会导致很多问题！ 所以我想有一个解决方案，开始缓存这些网站，所有其他请求结束后。

有没有办法做到这一点？

Answer 1

您通过WorkerGlobalScope中的cache.addAll()使用的相同高速缓存存储API也通过Window公开。这意味着您可以修改从您的受控页面上运行的JavaScript的相同缓存，并且您可以在执行cache.addAll()之前等待任何事件触发的任何window/document /事件。

或者，如果您希望在服务人员的install处理程序中保持缓存填充（例如，要确保服务工作人员安装，例如缓存总是被填充），您可以简单地延迟调用navigator.serviceWorker.register()，直到某个特定事件在您的页面上被触发。