浏览器的进程
- boswer进程：主进程，只有一个，负责页面的创建销毁，前进后退，网络资源的管理下载等
- GPU进程：硬件加速图形绘制
- 渲染进程：内部是多线程的，每个页面一个渲染进程。用于页面的解析、渲染、执行脚本等
- 第三方插件进程：每个插件对应一个进程
为什么多进程
- 防止单个面崩溃而影响浏览器
- 多进程充分利用多核优势
- 提高浏览器的稳定性
渲染进程
包含多个线程
- GUI渲染线程：解析html构建树，渲染，重排重绘
- js引擎线程：执行JavaScript脚本，依靠任务队列和事件循环
- 事件触发线程：不归js引擎线程控制，用于控制事件，当事件被触发的时候就把该事件添加到任务队列中等待js引擎空闲后执行
- 定时器触发线程：不是js线程计数的，通过单独的线程计时并触发，计时完成后添加到任务队列中
- 异步http请求线程：新开一个线程监控readyState状态变更，将回调函数推入任务队列中
js引擎线程和GUI渲染线程互斥
浏览器的渲染过程
- 构建DOM树：浏览器将html解析成树形数据结构，同时浏览器主进程负责css文件下载
- css下载完成后解析css，构建cssom树
- 根据DOM树和CSSOM树生成渲染树
- 根据渲染树进行布局计算各元素节点的尺寸位置，生成布局树
- 绘制树，绘制页面像素信息
- 浏览器主进程将默认图层和符合图层交给GPU，GPU将各图层合成，显示
普通文档流理解为：默认复合层
硬件加速声明一个新的复合层，新复合层之间无论如何变化都不会影响默认复合层的重排重绘
各图层之间单独绘制互不干扰
如何变成符合图层：
- translate
- vedio iframe canvas
- 该元素在复合层上面渲染
- 该元素的父元素为复合层
可以加z-index人为创建复合层，避免chrome创建不必要的合成层
本文章为转载内容，我们尊重原作者对文章享有的著作权。如有内容错误或侵权问题，欢迎原作者联系我们进行内容更正或删除文章。
