HTML 快取中單個 URL 的多個不同快取?
內容快取是實現快速流暢使用者體驗的有效方法。網頁中的每個 URL 都可以連結到快取清單的單個部分。但是,某些大型且很少使用的檔案會降低快取的整體速度。由於它們不需要更改,但每次快取更新時仍會重新下載,因此最好將此類檔案儲存在具有相同 URL 的不同快取中。這將提高其速度和效能。
那麼,如何分割 HTML 快取?在此之前,讓我們瞭解什麼是 HTML 快取。
什麼是 HTML 快取?
快取是一種儲存請求的給定響應,然後重用儲存的響應以滿足後續類似請求的方法。它存在於從原始伺服器到 Web 瀏覽器的整個過程中。
重用儲存的響應可以提高伺服器響應速度。它還可以提高硬體的效能。
HTML 快取是快取網頁的 HTML 內容。
示例
<!DOCTYPE HTML> <html manifest = “example.appcache” > <body> <h1> This is an example </h1> </body> </html>
快取型別
HTTP 快取儲存請求和響應,以便在後續請求中重用它們。它可以分為兩種型別:**共享快取**和**私有快取**。
共享快取
它是一個在原始伺服器和多個客戶端之間儲存資料的快取。它儲存響應並將其與所有客戶端重用。
因此,它不包含個性化內容。
私有快取
此快取僅儲存客戶端的內容。它為單個客戶端使用者儲存響應。因此,開發人員可以將個性化內容儲存在此快取中。
快取控制
**快取控制** HTTP 標頭指定用於管理來自請求和響應的快取資料的指令。
它具有各種指令,例如 no-transform、max-age、no-store、no-cache、private 和 public。讓我們在下面討論一些。
max-age
它是快取控制的響應指令之一,指示快取在生成響應後 X 秒內保持新鮮。
在此,新鮮狀態告訴瀏覽器響應仍然有效。因此,它可以被重用。而陳舊狀態表示響應無效,即已過期。
語法
Cache-Control: max-age = X
示例
Cache-Control: max-age = 856098
s-maxage
它也是一個響應指令,指示快取是新鮮的還是陳舊的。但是,它僅適用於共享快取。
示例
Cache-Control: s-maxage = 766498
時間戳
時間戳是檔案或日誌中記錄的時間,指示其內容新增、修改或傳輸的時間。其參考日期為 1970 年 1 月 1 日 UTC。
示例
此程式碼塊以毫秒為單位提供時間戳。
Date.now = function demo() { return new Date().getTime(); }
在 Javascript 中,您可以使用 Date.now()
為了以秒為單位獲取時間戳,請將其除以 1000。
示例
function demo() { return Math.floor (Date.now() / 1000); }
**注意** - Math.floor() 函式用於獲取小於或等於給定數字的最大整數。
示例
console.log( Math.floor(5.95));
解決此問題的最佳方法是對清單快取部分中的所有檔案使用 max-age,併為快取中的每個檔案新增時間戳。
如果其中任何檔案被修改,清單將更新時間戳。因此,只有在快取處理期間具有更新時間戳的檔案才會被下載。
示例
首先,讓我們建立一個快取清單檔案
<!DOCTYPE HTML> <html manifest = “example.appcache” > <body> <h1> This is an example </h1> </body Cache-Control: max-age =567890> </html>
CACHE 清單
快取 -
/example.html /demo.js
結論
正確處理快取會對您的網站產生重大影響。快取提供了高速和增強的使用者介面效能,即使用者享受更快的體驗。它還使網站伺服器能夠使用相同的硬體管理更多的網路流量。最重要的是,它具有成本效益,甚至可以重複提供相同的內容。簡而言之,正確的快取為開發人員提供了各種好處。
資料結構
網路
關係資料庫管理系統
作業系統
Java
iOS
HTML
CSS
Android
Python
C 程式設計
C++
C#
MongoDB
MySQL
Javascript
PHP