前端優(yōu)化總結(jié)
優(yōu)化用戶體驗(yàn)
| 文字 | 圖片 | 動(dòng)效 | 錯(cuò)誤頁(yè) |
|---|---|---|---|
| 占位圖 | 占位圖,大小, 清晰度 | 流暢度,展示效果 | 展示效果,信息告知 |
優(yōu)化響應(yīng)時(shí)間
靜態(tài)資源
| css | js | html | 圖片 | 音/視頻 |
|---|---|---|---|---|
| 配置cdn, 瘦身壓縮 | 同css | 同css | 同css | 同css |
| 抽象公用模版,去除冗余,選擇性緩存 | 同css | 同css | 字體圖標(biāo),CSS Sprite, 本地緩存(選擇性加密) | 本地緩存(選擇性加密) |
| 拆分,按需加載 | 拆分,按需加載 | |||
| 預(yù)渲染首屏(服務(wù)器) |
數(shù)據(jù)接口
渲染/應(yīng)用初始化
日志管理
客戶端HTTP協(xié)議緩存的研究
Web靜態(tài)資源緩存及優(yōu)化-美團(tuán)點(diǎn)評(píng)點(diǎn)餐
HTTP Headers - MDN
HTTP Header 詳解