瀏覽器快取機制是指通過 http 協議頭里的 cache-control（或 expires）和 last-modified（或 etag）等字段來控制檔案快取的機制。這應該是 web 中最早的快取機制了，是在 http 協議中實現的
cache-control 用於控制檔案在本地快取有效時長。最常見的，比如伺服器回包：cache-control:max-age=600 表示檔案在本地應該快取，且有效時長是600秒（從發出請求算起）。在接下來600秒內，如果有請求這個資源，瀏覽器不會發出 http 請求，而是直接使用本地快取的檔案。
last-modified 是標識檔案在伺服器上的最新更新時間。下次請求時，如果檔案快取過期，瀏覽器通過 if-modified-since 字段帶上這個時間，傳送給伺服器，由伺服器比較時間戳來判斷檔案是否有修改。如果沒有修改，伺服器返回304告訴瀏覽器繼續使用快取；如果有修改，則返回200，同時返回最新的檔案。
cache-control 通常與 last-modified 一起使用。乙個用於控制快取有效時間，乙個在快取失效後，向服務查詢是否有更新。
分析：cache-control 和 last-modified 一般用在 web 的靜態資源檔案上，如 js、css 和一些影象檔案。通過設定資源檔案快取屬性，對提高資源檔案載入速度，節省流量很有意義，特別是流動網路環境。但問題是：快取有效時長該如何設定？如果設定太短，就起不到快取的使用；如果設定的太長，在資源檔案有更新時，瀏覽器如果有快取，則不能及時取到最新的檔案。
last-modified 需要向伺服器發起查詢請求，才能知道資源檔案有沒有更新。雖然伺服器可能返回304告訴沒有更新，但也還有乙個請求的過程。對於流動網路，這個請求可能是比較耗時的。有一種說法叫「消滅304」，指的就是優化掉304的請求。
1.在要快取的資源檔名中加上版本號或檔案 md5值字串，如 common.d5d02a02.js，common.v1.js，同時設定 cache-control:max-age=31536000，也就是一年。在一年時間內，資源檔案如果本地有快取，就會使用快取；也就不會有304的回包。
2.如果資源檔案有修改，則更新檔案內容，同時修改資源檔名，如 common.v2.js，html頁面也會引用新的資源檔名。
dom storage 是通過儲存字串的 key/value 對來提供的，並提供 5mb （不同瀏覽器可能不同，分 host)的儲存空間（cookies 才 4kb)。另外 dom storage 儲存的資料在本地，不像 cookies，每次請求一次頁面，cookies 都會傳送給伺服器。
dom storage 分為 sessionstorage 和 localstorage。localstorage 物件和 sessionstorage 物件使用方法基本相同，它們的區別在於作用的範圍不同。sessionstorage 用來儲存與頁面相關的資料，它在頁面關閉後無法使用。而 localstorage 則持久存在，在頁面關閉後也可以使用。
sessionstorage 是個全域性物件，它維護著在頁面會話(page session)期間有效的儲存空間。只要瀏覽器開著，頁面會話週期就會一直持續。當頁面重新載入(reload)或者被恢復(restores)時，頁面會話也是一直存在的。每在新標籤或者新視窗中開啟乙個新頁面，都會初始化乙個新的會話。
當瀏覽器被意外重新整理的時候，一些臨時資料應當被儲存和恢復。sessionstorage 物件在處理這種情況的時候是最有用的。比如恢復我們在表單中已經填寫的資料。
local storage 的介面、用法與 session storage 一樣，唯一不同的是：local storage 儲存的資料是永續性的。當前 page 關閉（page session 結束後），儲存的資料依然存在。重新開啟page，上次儲存的資料可以獲取到。另外，local storage 是全域性性的，同時開啟兩個 page 會共享乙份存資料，在乙個page中修改資料，另乙個 page 中是可以感知到的。
indexeddb 也是一種資料庫的儲存機制，但不同於已經不再支援的 web sql database。indexeddb 不是傳統的關聯式資料庫，可歸為 nosql 資料庫。indexeddb 又類似於 dom storage 的 key-value 的儲存方式，但功能更強大，且儲存空間更大。
怎麼優化h5的效能
優化方案 資源載入 1.首屏載入 在1s內內容載入完畢，loading進度條消失 2.延時載入 先載入螢幕可視範圍內的資源，其他的在之後通過網路載入 3.滾屏載入 一種常見的動態無重新整理資料載入方法，4.響應式載入 在解析度不同的手機上使用不同的css，載入不同的資源 5.第三方資源非同步載入 引...
利用單例優化效能
class db return db.instance constructor consnect find var mydb db.getinstance 如果沒有單例，每例項化一次，就會執行一次建構函式，效能大大下降 var mydb new db var mydb new db 控制台輸出結果 ...
H5離線快取
什麼是離線快取 離線快取可以將站點的一些檔案快取到本地，它是瀏覽器自己的一種機制，將需要的檔案快取下來，以便後期即使沒鏈結網路，被快取的頁面也可以展示 離線快取的優勢 提高使用者的訪問速度，節省流量 如何實現離線快取 內容為 cache manifest 1.0 版本號 這個注釋是給 開發者看的，代...