一.首先講講使用緩存的好處：
(1).當頁面渲染的數據過多時，為了減輕對內存的占用，對初次接收且會用到的數據進行本地緩存，是有着大好處的.
(2).受網速等各種因素的影響，當渲染數據過多時，若存在頻繁的切換頁面，用戶體驗效果不佳。
二.常見的本地緩存方式
1.利用storage來對數據進行存儲(sessionStorage、localStorage）
a.sessionStorage
臨時的會話存儲，只要當前的會話窗口未關閉，存儲的信息就不會丟失，即便刷新了頁面或者在編輯器中更改了代碼，存儲的會話信息也不會丟失。
用法:詳情可見另一隨筆：https://www.cnblogs.com/liangye/p/13430428.html
b.localStorage
是一種如果你不主動去清除，會一直將數據存儲在客戶端的儲存方式，即使關閉了瀏覽器，下次打開的時候仍然可以看到之前存儲的未主動清除的數據（即便是
殺毒軟件或者瀏覽器自帶的清除功能，也不能將localStorage存儲的數據清除掉）.
用法：和sessionStorgae一致
注意：storage存儲的數據只能是字符串類型，其他類型的數據需做類型轉換
storage直接屬於頂層對象window.
2.cookie
cookie屬於較老且最常見用的最多的技術了，cookie的優點很多，用起來也比較方便
但是缺點也很多：
cookie兼容所有的瀏覽器，但其存儲的數據是有大小限制的，一般同源是4kb；
cookie本地存儲的數據會被發送到服務器（所以建議在服務器環境下使用cookie）；
跨域訪問問題；浪費帶寬等等；
然：最近在使用本地cookie緩存時發現chrome竟然不支持js本地操作cookie，其他市面上的主流瀏覽器基本都支持
這也告訴了我們：在使用cookie前，先確認瀏覽器支不支持cookie先！！！
檢查當前瀏覽器是否支持或者禁用了cookie，可用以下js代碼：
View Code
可見chrome:
在js的腳本中，cookie實際上是document的一個字符屬性，當你讀取cookie的值時，得到的是一個字符串，里面的是當前web存放的所有的cookie的name,value,除此之外，
每一個cookie除了有name，value，還有其他四個屬性：expires過期時間,path路徑，domain域以及secure安全等。
cookie中存儲的數據，如果沒有設置有效期的話，瀏覽器關閉的時候就會被清空（並非關系選項卡）
cookie的區分是以域名的方式。
cookie的用法：以鍵值對的方式來存儲數據（key：value形式）,一個域名下能存儲的cookie個數是不同的，具體的看瀏覽器的支持性了
當一個域名下有多個cookie時，輸出document.cookie時輸出的是當前域名下的所有cookie，cookie之間以分號加空格的形式隔開
存儲格式：document.cookie="name=<value>[;expires=<date>][;domain=<domain>][;secrue]"
普通的存儲數據如下：
document.cookie = "id=18";
document.cookie = "name=liangye"; alert(document.cookie); //id=18; name=liangye 由於沒有設置有效期expires,瀏覽器關閉后會自動來清理cookie（並非關閉標簽）
js中如果用cookie來存儲數據的話，建議是自己寫封裝好的函數來簡化美化下代碼。之后會單獨寫篇關於cookie的基本操作隨筆。
已寫，詳情可見：https://www.cnblogs.com/liangye/p/13437294.html
三.cookie和storage的區別
1.cookie兼容所有的瀏覽器（本地cookie谷歌不支持），storage不支持IE6~8;
2.二者對存儲的內容均有大小限制，前者同源情況寫一般不能存儲4kb的內容，后者同源一般能存儲只能存儲5MB的數據
3.cookie有過期時間，localStorage是永久存儲（如果你不手動去刪除的話）
4.一些瀏覽器處於安全的角度可能會禁用cookie,但無法禁用localStorage
實際項目中本地緩存都能來存儲什么？
cookie：記住用戶名密碼以便下次自動登錄等等：當用戶登錄成功后，存儲用戶的部分信息，便可以在項目的任何頁面知道當前的用戶是誰了。
storage：存儲一些不容易過期的數據（如從api接口中接收的用於渲染頁面的數據），在存儲時一般加入一個存儲時間(time:Date.now()),以便在下次
刷新頁面的時候判斷存儲的事件有沒有超過預定的時間；也可以用來存儲一些頁面的源代碼，比如css樣式或者html等等（有必要的時候需要來結合前台的數據）；
注意：本地存儲一般是明文存儲，對於重要的信息不要直接存儲在本地，如果非要存儲的話，記得要對存儲的信息進行加密。
加密方法：
a.可逆轉加密（一般都是自己來設置自規則）
b.不可逆轉加密：（一般都是基於MD5來進行加密，可能會把MD5加密后的數據二次加密）
-
想要了解加密的可參考這兩個入門鏈接：https://www.jianshu.com/p/650a6d29c134；https://www.jianshu.com/p/c256ffba7c62