前端數據緩存
在前端開發中有些數據可以在第一次請求的時候全部拿過來保存在緩存對象，方便使用的時候不用每次去請求服務器，這種方法可以極大地減少對服務器的訪問從而提高頁面加載速度。
一、全局變量緩存
父頁面從服務器獲取到基礎數據 存儲在一個全局對象中 當子頁面需要此信息時 直接獲取父級對象信息 從而減少HTTP請示連接數 此方式涉及到作用域問題 需找準當前作用域問題
<head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-UA-Compatible" content="ie=edge"> <title>父級頁面</title> <script> //定義全局緩存變量 var Cache = { BaseInfo: {} }; //設置緩存數據 Cache.BaseInfo.Name = "Tom"; Cache.BaseInfo.Age = 20; </script> </head> <body> <iframe src="./demo.html"></iframe> </body><head> <meta charset="UTF-8"><
meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge"> <title>子級頁面信息</title> <script> function GetBaseInfo() { document.getElementById("show").innerHTML = parent.parent.Cache.BaseInfo.Name; } </script> </head> <body> <div id="show" onclick="GetBaseInfo()">點擊我</div> </body>二、Cookie緩存
cookie是以鍵值對的形式保存的，即key=value的格式。各個cookie之間一般是以“;”分隔。cookie是瀏覽器提供的一種機制，它將document 對象的cookie屬性提供給JavaScript。可以由JavaScript對其進行控制，而並不是JavaScript本身的性質。cookie是存於用戶硬盤的一個文件，這個文件通常對應於一個域名，當瀏覽器再次訪問這個域名時，便使這個cookie可用。因此，cookie可以跨越一個域名下的多個網頁，但不能跨越多個域名使用。
cookie機制將信息存儲於用戶硬盤，因此也可以作為全局變量，它可以用於以下幾種場合。
（1）保存用戶登錄狀態（2）跟蹤用戶行為（3）定制頁面（4）創建購物車。
cookie的缺點主要集中於安全性和隱私保護。主要包括以下幾種：
（1）cookie可能被禁用，安全系數較低。
（2）cookie是與瀏覽器相關的。 容量很小（4K以內）取決於瀏覽器
（3）cookie可能被刪除。
（4）cookie增加了網絡負擔 通訊時會攜帶所有cookie
（5）cookie原生操作也不方便 增刪改都要‘document.cookie=’
前端數據緩存