瀏覽器緩存機制
- 強緩存：瀏覽器不發(fā)送請求到服務器，直接從本地硬盤讀取文件（200 from cace）。通過請求頭里的exprice 和 cache-contro:img-max實現(xiàn)
- 協(xié)商緩存: 瀏覽器向服務器發(fā)送請求，服務器查看文件是否修改了。若未修改，則返回304，瀏覽器從本地讀取緩存文件。
兩者區(qū)別：協(xié)商緩存會和服務器通信，強緩存不與瀏覽器通信
下面來詳細看下兩種緩存是如何實現(xiàn)：
強緩存原理：
在請求頭里，利用Expires或者Cache-Control，設(shè)置過期時間，其實就是一個有效期，表示文件在當前時間內(nèi)都是有效的。
Expires是http1.0提出的一個表示資源過期時間的header，它描述的是一個絕對時間，由服務器返回，用GMT格式的字符串表示，如：Expires:Thu, 31 Dec 2037 23:55:55 GMT。若當前訪問時間，在這個時間段內(nèi)，則表示有效。
Cache-Control描述的是一個相對時間，max-age表示在xxxs之內(nèi)，文件有效。在進行緩存命中的時候，都是利用客戶端時間進行判斷，所以相比較Expires，Cache-Control的緩存管理更有效，安全一些。
高性能網(wǎng)站建設(shè)進階指南之讀書筆記
＊ 第一章 ： ajax性能：優(yōu)化性能，應從性能最大瓶頸處入手，否則效果不佳。很多時候，瀏覽器的瓶頸都在dom繪制和布局，渲染中，并不在js執(zhí)行過程。所以，分析性能問題的第一步，就是明確每階段的耗時。
下面講一講幾個關(guān)鍵的網(wǎng)頁性能指標：
- document response返回時間和dom樹構(gòu)建時間
- css加載完畢時間
- js加載完畢時間
- js執(zhí)行完畢，用戶可操作時間
那么如何獲取這幾個關(guān)鍵耗時呢？公司內(nèi)部都有測速系統(tǒng)，想要獲取某個點，自己設(shè)置下就可以了。不過chrome的network面板上，有記錄兩個時間點：
- load：dom樹構(gòu)建完畢時間（= DOCUMENT文檔返回 + 瀏覽器解析HTML元素并構(gòu)建dom樹過程 ）
- DOMContentLoaded：瀏覽器的DOMContentLoaded事件。不會等待CSS文件、圖片、iframe加載完成。
備注：$(document).ready()與window.onload的區(qū)別
window.onload ： 頁面所有元素加載完畢，包括圖片，flash，iframe 等
$(document).ready() ： dom樹，加載完畢。所以它比window.onload先執(zhí)行。而jquery內(nèi)部及監(jiān)聽的DOMContentLoaded事件
RTX截圖未命名.png
