使用Basket.js進行腳本緩存，我做錯什么了嗎？

Question

我正在嘗試使用腳本緩存將腳本存儲在localStorage中。 在這種情況下，我正在嘗試由Addy Osmani和其他人創建的Basket.js。 對於使用的情況，性能很棒，但是問題是它的工作方式不符合我的預期，但是老實說，也許它正在工作，而且我不了解腳本緩存的基本原理。 因此，讓我描述一下如何使用它：

首先，我設置標記：

<script src="/framework/plugins/base/basket.js"></script>

然后，將所有腳本包含在以下代碼框中：

<script>basket.require({url:'/framework/plugins/base/jquery-2.1.1.js',expire:168},{url:'/framework/plugins/base/jquery.ui-1.10.4.js',expire:168},{url:'/framework/plugins/forms/dropzone/dropzone.js',expire:168});</script>

當我加載測試頁時，除刷新文檔時所做的所有工作外，其他所有工作均正常。 一旦被緩存...快閃！ 它確實運行良好，但是我的問題是腳本緩存本身。 我總是必須刷新文檔才能看到其效果。

老實說，我認為腳本緩存將腳本存儲在localStorage中並執行它們，因此您可以兩全其美。 但是，事實並非如此。

我是在做錯什么，還是任何腳本緩存模型都像這樣工作？ 總是在第二次運行？

Answer 1

您說“總是必須刷新文檔才能看到其效果”是正確的。 據我了解，緩存僅在首次加載資源之后發生。 簡單地說，basket.js將看到需要jquery並將其緩存在localstorage中。 然后將其用於從客戶端加載腳本，並通過這樣做將對資源的請求減少到服務器，以在后續加載時進行jquery。 這樣可以加快重復加載時的頁面加載時間，從而加快刷新時的響應時間。

最初，如果不將資源加載到客戶端，則basket.js無法將腳本緩存到本地存儲。

在這里可以找到有關瀏覽器緩存機制及其實現的基本說明。

就是說，如果您希望在頁面的初始加載時加快資源的加載時間，我建議您使用Content Delivery Network（CDN）服務。