浏览器解析草图
浏览器渲染原理
1、解析HTML，生成DOM树，解析CSS，生成CSSOM树
2、将DOM树和CSSOM树相结合，生成渲染树（Render Tree）
3、Layout（回流）：根据生成的渲染树，计算它们在设备视口（viewport）内的确切位置和大小，这个计算的阶段就是回流
4、Painting（重绘）：根据渲染树以及回流得到的几何信息，得到节点的绝对像素
5、Display：将像素发送给GPU，展示在页面上
浏览器页面性能优化
核心就是：减少HTTP的请求次数和大小
比如：
- 资源合并压缩
- 图片懒加载
- 音频 走 流文件（加载一部分）
- 尽可能避免回流和重绘