页面加载->渲染流程

渲染流程：

转化：浏览器从磁盘或网络读取HTML的原始字节，浏览器会将这段原始文件按照相应编码规范进行解码（现在一般为utf-8）。

符号化：根据W3C标准转化为对应的符号（一般在尖括号内）。

DOM构建：HTML解析器会解析其中的tag标签，生成token，遇到CSS或JS会发送相应请求。HTML解析时阻塞主进程的，CSS一般也是阻塞主进程的（媒体查询时例外），也就是说它们在解析过程中是无法做出响应的。而JS手动添加async后达到异步加载，根据token生成相应DOM树。

CSSDOM构建，添加CSS样式生成CSSDOM树。

渲染树构建，从DOM树的根节点开始，遍历每个可见的节点，给每个可见节点找到相应匹配的CSSOM规则，并应用这些规则，连带其内容及计算的样式。

样式计算，浏览器会将所有的相对位置转换成绝对位置等一系列的样式计算。

布局，浏览器将元素进行定位、布局。

绘制，绘制元素样式，颜色、背景、大小、边框等。

合成，将各层合成到一起、显示在屏幕上。

参考链接

https://bitsofco.de/understanding-the-critical-rendering-path/

webView与浏览器直接访问的区别

https://bbs.exmobi.cn/thread-3100-1-1.html