浏览器架构#

背景#

CPU 与 GPU#

计算机架构#

进程与线程#

进程间的通信 IPC#

浏览器架构#

进程工作内容#

浏览器进程#

渲染进程#

插件进程#

GPU 进程#

多进程架构的好处#

面向服务的架构#

基于站点隔离的渲染进程#

一次访问#

输入处理#

访问开始#

处理响应数据#

渲染过程#

提交访问#

加载完毕#

访问不同的站点#

Service Worker#

访问预加载#

渲染进程负责页面的内容#

解析过程#

DOM 的创建#

额外资源的加载#

JavaScript 会阻塞转化过程#

告诉浏览器要如何加载资源#

样式计算#

布局 layout#

绘制 Paint#

渲染过程是昂贵的#

合成 Compositing#

层 Layer#

栅格线程与合成线程#

从浏览器角度看事件#

合成线程对事件的处理#

标记"慢滚动"区域#

在事件监听时标记#

查找事件目标#

减少发送给主线程的事件数量#

总结#

• 浏览器进程做为最重要的进程负责大多数页签外部的工作，包括地址栏显示、网络请求、页签状态管理等。
• 不同的渲染进程负责不同的站点渲染工作，渲染进程间彼此独立。
• 渲染进程在渲染页面的过程中会通过浏览器进程获取站点资源，只有安全的资源才会被渲染进程接收到。
• 渲染进程中主线程负责除了图像生成外绝大多数工作，如何减少主线程上代码的运行是交互性能优化的关键。
• 渲染进程中的合成线程和栅格线程负责图像生成，利用分层技术可以优化图像生成的效率。
• 当用户与页面发生交互时，事件的传播途径从浏览器进程到渲染进程的合成线程再根据事件监听的区域决定是否要传递给渲染进程的主线程处理。