一口叙、渲染優(yōu)化
1、動畫優(yōu)化
①使用css3動畫
② 使用requestAnimation +Frame動畫 代替seTimeout
2嗅战、高頻事件優(yōu)化
①touch事件
②scroll事件
3妄田、圖片優(yōu)化
①圖片壓縮
② webp 優(yōu)于 jpg
③ png優(yōu)于gif
④ 對圖片使用懶加載
⑤ 避免使用DataURL
4、GPU加速
①使用transform觸發(fā)
② transform觸發(fā)
③ opacity
5仗哨、DOM層次不宜躲過
6形庭、js主動的釋放內(nèi)存
二、css優(yōu)化
1厌漂、層次不超過3層
2萨醒、合并css規(guī)范 合并margin bachground 等特性
3、移除空的css的規(guī)則
4苇倡、去掉0的單位
5富纸、不要申明過多的fontsize
三、加載優(yōu)化
1旨椒、減少http請求
2晓褪、壓縮js css html 靜態(tài)資源并在服務器端設置gzip
3、首屏加載 不要超過120k 大小
4综慎、壓縮圖片
5涣仿、避免重定向
6、異步加載第三方資源
①async 注：只適用于外部腳本 只有適用src屬性時（HTML5新特性）
②動態(tài)創(chuàng)建script
③defer 注：規(guī)定是否對腳本進行延遲執(zhí)行 直到頁面加載為止 只有IE支持
語法 <script defer = "value" >
7示惊、oneRequest 首次內(nèi)斂css javascript 存 localstorge 第二次讀取直接localstorge
8好港、按需加載
①滾動加載
②點擊加載
四、腳本執(zhí)行優(yōu)化
1米罚、避免iframe img 等src 為空
2钧汹、圖片盡量避免使用DataUrl
3、避免重設圖片的大小
4录择、點擊事件優(yōu)化
5拔莱、注意scrloll resize綁定時機
最后編輯于 ：
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
