Appearance
浏览器
首屏优化
减少http请求
使用http2/http3协议
服务端渲染
资源加载
资源压缩,开启gzip
字体子集化
主进程优化
渲染优化
减少重绘重排
浏览器渲染过程
解析HTML生成DOM树。 解析CSS生成CSSOM规则树。 解析JS,操作 DOM 树和 CSSOM 规则树。 将DOM树与CSSOM规则树合并在一起生成渲染树。 遍历渲染树开始布局,计算每个节点的位置大小信息。 浏览器将所有图层的数据发送给GPU,GPU将图层合成并显示在屏幕上。
浏览器渲染过程
解析HTML生成DOM树。 解析CSS生成CSSOM规则树。 解析JS,操作 DOM 树和 CSSOM 规则树。 将DOM树与CSSOM规则树合并在一起生成渲染树。 遍历渲染树开始布局,计算每个节点的位置大小信息。 浏览器将所有图层的数据发送给GPU,GPU将图层合成并显示在屏幕上。