頁面的生產過程
HTML轉化成DOM
CSS轉化成CSSOM
結合DOM+CSSOM锭亏，生成渲染樹
生成布局(layout)，即將渲染樹的所有節(jié)點進行平面合成十绑。
將布局繪制(paint)屏幕上
頁面優(yōu)化的方式
優(yōu)化:
減少HTTP請求(合并CSS/JS聚至，圖片小于8KB的用base64編碼轉化)
減少DOM操作(可使用documentFragment)
避免不必要的重繪重排
優(yōu)化css選擇器(從右到左匹配)
css/js minify，混淆壓縮本橙，減少體積
開啟GZIP壓縮
將css放在頂部扳躬，js放在底部(javascript會阻塞瀏覽器的渲染)
壓縮圖片以及css sprite
使用CDN加速，適當進行文件緩存
合理控制cookie大小(每次渲染都會包含cookie)
主要是兩種提高資源的獲取速度與渲染效率甚亭，減少不必要的重排重繪
思想:
性能優(yōu)化先優(yōu)化性能瓶頸贷币。
用戶交互時也會出現(xiàn)性能瓶頸。大量的DOM更新(react的優(yōu)勢就在這里亏狰，虛擬dom可以減少不必要的dom更新)役纹，頻繁的頁面重排重繪
移動端的性能優(yōu)化
主要需要解決的問題就是首屏時間
1.減少請求數
2.減少傳輸體積
3.盡可能利用緩存
4.縮短關鍵路徑
5.合理安排請求順序
