這篇文章主要介紹了詳解HTML5中的manifest緩存使用,文中同時介紹了相關的一些自動化工具,需要的朋友可以參考下起源
html5之前的網頁,都是無連接,必須聯網才能訪問,這其實也是web的特色,這其實對於PC是時代問題並不大,但到了移動互聯網時代,設備終端位置不再固定,依賴無線信號,網絡的可靠性變得降低,比如坐在火車上,過了一個隧道(15分鐘),便無法訪問網站,這對於web的傷害是很大的,比如對於《ecmascript合集》這樣的為閱讀而生的頁面。
html5便引入了cache manifest 文件。那麼什麼是cache manifest呢,接下來會講到。
什麼是Cache Manifest首先manifest是一個後綴名為minifest的文件,在文件中定義那些需要緩存的文件,支持manifest的瀏覽器,會將按照manifest文件的規則,像文件保存在本地,從而在沒有網絡鏈接的情況下,也能訪問頁面。
當我們第一次正確配置app cache後,當我們再次訪問該應用時,瀏覽器會首先檢查manifest文件是否有變動,如果有變動就會把相應的變得跟新下來,同時改變瀏覽器裡面的app cache,如果沒有變動,就會直接把app cache的資源返回,基本流程是這樣的。
Manifest的特點離線瀏覽: 用戶可以在離線狀態下瀏覽網站內容。
更快的速度: 因為數據被存儲在本地,所以速度會更快.
減輕服務器的負載: 瀏覽器只會下載在服務器上發生改變的資源。
瀏覽器支持情況所有主流瀏覽器均支持應用程序緩存,除了Internet Explorer。 caniuse給出的答案如下圖所示。
如何使用html新增了一個manifest屬性,可以用來指定當前頁面的manifest文件。
創建一個和html同名的manifest文件,比如頁面為index.html,那麼可以建一個index.manifest的文件,然後給index.html的html標籤添加如下屬性即可:
XML/HTML Code複製內容到剪貼板