浏览器渲染过程

内核

浏览器组成

过程

基本流程
解析 HTML 构建 DOM Tree–> 构造 Render Tree–> 布局 Render Tree–> 绘制 Render Tree

概念
1) HTML—-> DOM Tree

2) Style Rules —> CSS Tree

3) JS 操作 DOM API/CSSDOM API—> 操作 DOM / CSS

4)DOM+CSS DOM=Render Tree

5) 通过 Native GUI API 绘制 –>painting

6) 页面某部分改变影响了布局需要回流 –>reflow

7) 改变某个元素但不影响布局，不改变几何尺寸 –>repaint

主要过程