两分钟全知道浏览器渲染解析过程

浏览器的渲染

介绍浏览器组件的构成：

下面先来张图看下浏览器引擎工作流程：

浏览器解析 ：
1、浏览器通过请求的 URL 进行域名解析，向服务器发起请求，接收文件（HTML、CSS、JS、Images等等）。
2、解析HTML 文件后，开始构建 DOM树
3、解析CSS 样式文件后，开始构建 CSSOM树
4、Javascript 脚本文件加载后， 通过 DOM和 CSSOM生成渲染树
５、将渲染树的每个节点遍历到屏幕上
构成DOM树：
当浏览器接收到服务器响应的HTML后，会遍历HTML文档节点，生成DOM树

构成CSSOM规则树：
CSS规则对象包含对应于CSS语法的选择器和声明对象以及其他对象。

构成渲染树（由DOM和CSSOM组合而成）：
DOM和CSS规则树共同构建称渲染树，浏览器先从DOM树的根节点开始遍历每个节点，对于每个节点再寻找适配的CSS样式规则。