- 解析 HTML：浏览器会将 HTML 代码解析成 DOM 树，即将 HTML 标签转换成 DOM 元素，并建立它们之间的关系。
- 构建 CSSOM：浏览器会将 CSS 代码解析成 CSSOM 树，即将 CSS 样式转换成 CSS 规则，并建立它们之间的关系。
- 合并 DOM 和 CSSOM：浏览器会将 DOM 树和 CSSOM 树合并成一棵渲染树，即将 DOM 元素和 CSS 规则进行匹配，并计算出每个元素的样式。
- 布局：浏览器会根据渲染树中每个元素的大小、位置等信息，计算出每个元素在页面中的准确位置。
- 绘制：浏览器会将渲染树中每个元素的样式应用到页面上，并将它们绘制出来。
- 重绘和回流：当页面中的元素发生变化时，浏览器会重新计算渲染树，并重新绘制页面。这个过程称为重绘和回流，它会消耗大量的计算资源，因此应该尽量避免频繁触发。
graph TD
解析HTML成DOM树 --> 解析CSS为CSS规则树 --> 合成DOM和CSSOM为Render树 --> 布局 --> 绘制 --> 重绘和回流
