- 如何少加載文件
- 合理利用瀏覽器緩存(通過main.js 的加載來看待這個問題)
- 首次加載 http 請求痴腌,server 正常返回
- 返回響應頭加上強緩存的說明
- expires: wed 11 Aug 2019 20:50:00 (過期時間)
- cache-control: max-age = 3000000
- 兩個 header 都是后端告訴瀏覽器,這個文件多長時間內(nèi)不過期(比如一小時)
- 瀏覽器接受到上面兩個 header 就會將文件保存起來
- 一個小時內(nèi)再次請求這個文件
- 瀏覽器識別到強緩存命中髓霞,請求不發(fā)出秀仲,直接用本地的緩存文件哎媚,狀態(tài)碼是 200 from cache
- 2 個小時后翩腐, 再次請求這個文件,強緩存失敗,使用協(xié)商緩存
- 瀏覽器不會直接發(fā)出請求阿逃,而是問一下后端,header 帶上請求頭
- if-modified-since:日期 后端小老弟赃蛛,這個文件恃锉,在這個日子之后,有沒有修改過呕臂,后端告訴你破托,沒改過,請用緩存 相應是 304 not modified歧蒋,瀏覽器直接用緩存
- 優(yōu)先級更高的 是 etag 文件的指紋 內(nèi)容不變 指紋不變
- 如果后端告訴你 改過了 只能重新加載了
文件緩存雖然 js 控制不到土砂,瀏覽器控制的,但是我們可以通過工程化來更高效利用緩存
模板
靜態(tài)資源(css谜洽,js萝映,image,video阐虚, audio) 等
- 模板或者 html 不能有緩存(這個是入口文件序臂,一旦新代碼發(fā)布上線,就沒法加載了)