服務工作者預加載的子頁面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()，直到某個特定事件在您的頁面上被觸發。