====索引=====
【Web緩衝機制概述】1 – Web緩衝的作用與類型
【Web緩衝機制概述】2 – Web瀏覽器的緩衝機制
【Web緩衝機制概述】3 – 如何構建可緩衝網站
【Web緩衝機制概述】4 – HTML5時代的Web緩衝機制
【Web緩衝機制概述】5 – Web App時代的緩衝機制新思路
============
隨著現代瀏覽器的推動，Flash放棄對移動端的支援，HTML5無疑成為當前Web前端炙手可熱的話題。各大遊戲開發商、App開發商紛紛投入人力進行研究和技術儲備。相信不久的將來，HTML5會迎來一個快速發展和普及的春天。那麼，HTML5這個新一代的標準，又給我們帶來哪些緩衝機制呢？
HTML5 之離線應用Manifest
我們知道，使用傳統的技術，就算是對網站的資源都實施了比較好的緩衝策略，但是在斷網的情況下，是無法訪問的，因為入口的HTML頁面我們一般營運的考慮，不會對其進行緩衝。HTML5的Cache Mainifest離線應用特性就能夠協助我們構建離線也能使用的網站，所有的資源都使用瀏覽器本機快取，當然前提是要求在連網的情形下使用過一次網站。
如何?離線訪問特性實現的步驟非常簡單，主要3個步驟：
1）在伺服器上添加MIME TYPE支，讓伺服器能夠識別manifest尾碼的檔案
AddType text/cache-manifest manifest
2）建立一個尾碼名為.manifest的檔案，把需要緩衝的檔案按格式寫在裡面，並用注釋行標註版本
CACHE MANIFEST
# 直接緩衝的檔案
CACHE:
Path/to/cache.js
# version：2012-03-20
3）給 <html> 標籤加 manifest 屬性，並引用manifest檔案
具體可以參考：HTML5 緩衝: cache manifest
<html manifest=”path/to/name-of.manifest”>
離線應用訪問及更新流程從Manifest的機制來看，即使我們不是為了建立離線應用，也同樣可以使用這種機制用於快取檔案，可以說是給Web緩衝提供多一種可以選擇的途徑。
存在的問題：快取檔案更新控制不靈活就目前HTML5提供的manifest機制來講，一個頁面只能引用一個manifest頁面，而且一旦發現這個manifest改變了，就會把裡面所有定義的快取檔案全部重新拉取一遍，不管實際上有沒有更新，控制比較不靈活。針對這個問題，也有的同學提出了一些建議，比如把需要緩衝的檔案分模組切分到不同manifest中，並分開用HTML引用，再使用強大的iframe嵌入到入口頁面，這樣就當某一個模式需要有更新，不會導致其他模組的檔案也重新拉取一遍。
HTML5 之本機存放區localstorage
HTML5給我們提供本機存放區localstorage特性，嚴格來講，其實已經不算傳統Web緩衝的範疇。因為它儲存的地方是跟Web緩衝分開的，是瀏覽器重新開闢的一個地方。
localstorage的作用本機存放區localstorage的作用主要使Web頁面能夠通過瀏覽器提供的set/get介面，儲存一些自訂的資訊到本地硬碟，並且在單次訪問或以後的訪問過程中隨時擷取或修改。
Localstorage的使用Localstorage提供了幾個非常易用的Api，setItem/getItem/removeItem/clear，具體的可以參考：Html5 Step by Step(二) 本機存放區
Localstorage的緩衝用途Localstorage設計的本意可能是用來儲存一些使用者操作的個人化的文本類型的資訊和資料，當我們其實也可能拿來當Web緩衝區使用，比如我們可以將Base64格式編碼的圖片資訊，存在localstorage中，再次訪問時，直接本地擷取後，使用Css3的Data:image的方式直接展現出來。
存在的問題：大小限制按照目前標準，目前瀏覽器只給每個獨立的網域名稱提供5m的儲存空間，當儲存超過5m，瀏覽器就會彈出警告框。
可以說，HTML5的Manifest和localstorage是給我們在考慮Web緩衝的時候提供了多一種思路，當你開發的應用只面對現代瀏覽器的時候，不妨可以考慮一下。
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
