浏览器多进程架构

线程与进程

进程是 CPU资源分配的最小单位；线程是 CPU调度的最小单位。

• 进程:
  程序的一次执行, 它占有一片独有的内存空间
  可以通过windows任务管理器查看进程 / 浏览器任务管理器

• 线程:
  是进程内的一个独立执行单元
  是程序执行的一个完整流程
  是CPU的最小的调度单元

• 关系
  一个进程至少有一个线程(主)
  程序是在某个进程中的某个线程执行的
  

• 进程 - 工厂，有单独的专属自己的工厂资源，多个工厂之间独立存在。

• 线程 - 工人，多个工人在一个工厂中协作工作，工厂与工人是 1:n的关系。也就是说一个进程由一个或多个线程组成，线程是一个进程中代码的不同执行路线；

• 工厂的空间是工人们共享的，这象征一个进程的内存空间是共享的，每个线程都可用这些共享内存

多进程与多线程

• 多进程：在同一个时间里，同一个计算机系统中如果允许两个或两个以上的进程处于运行状态。比如你可以听歌的同时，打开编辑器敲代码，编辑器和听歌软件的进程之间丝毫不会相互干扰。
• 多线程：程序中包含多个执行流，即在一个程序中可以同时运行多个不同的线程来执行不同的任务，也就是说允许单个程序创建多个并行执行的线程来完成各自的任务。

js是单线程执行的(回调函数也是在主线程)，指的是一个进程里只有一个主线程
H5提出了实现多线程的方案: Web Workers，不过只能是主线程更新界面

定时器问题:

• 定时器并不真正完全定时
• 如果在主线程执行了一个长时间的操作, 可能导致延时才处理

浏览器 - 一个进程可以有多个线程

从上图中可知：

1、浏览器是多进程
2、不同类型的标签页都会开启一个新的进程
3、相同类型的标签页是会合并到一个进程

• 以Chrome浏览器中为例，当你打开一个 Tab 页时，其实就是创建了一个进程（chrome使用多个进程来隔离不同的标签页。默认每一个tab页都是一个进程，互不影响）当然浏览器也会有自己的优化机制，比如打开多个空白的标签页，在chrome的任务管理器里面，就会发现把这些空白页，都合成了一个进程，所以一个tab标签页对应一个进程也不是绝对的

• 一个进程中可以有多个线程，比如渲染线程、JS 引擎线程、HTTP 请求线程等等。
  当你发起一个请求时，其实就是创建了一个线程，当请求结束后，该线程可能就会被销毁。

浏览器除了主进程，还有其他进程来辅助支撑主进程

1. Browser主进程（浏览器进程）：
   负责调控、主控，只存在一个
   负责浏览器界面显示，与用户交互，前进、后退等
   负责各个页面间的管理，创建和销毁其他进程
   网络资源管理，下载等

2. 第三方插件：
   每种类型的插件是一个进程，当使用时创建

3. GPU进程：
   最多一个，用于3D绘制和硬件加速等

4. 浏览器渲染进程（浏览器内核）（Renderer进程，内部是多线程的）：
   主要作用：页面渲染，脚本执行，时间处理等

每个渲染器进程都运行在沙箱内，这意味着它对磁盘、网络和显示器没有直接的访问权限。所有跟网络应用的交互，包括用户输入事件和屏幕绘制都必须通过浏览器进程。这可以让浏览器进程监视渲染器的可疑行为，一旦发现其从事破坏活动就将其终止。

浏览器内核(浏览器渲染进程)

浏览器内核是通过取得页面内容、整理信息（应用CSS）、计算和组合最终输出可视化的图像结果，通常也被称为渲染引擎。
浏览器内核是多线程
浏览器渲染进程会开启多个线程协作完成，包括以下两种线程：

• 主线程（下面的都是线程啊！这只是线程的分类）
  js引擎线程 : 编译运行js程序
  GUI 渲染线程：渲染和绘制页面
  【 html,css文档解析模块 : 解析页面文本，DOM/CSS模块 : 负责dom/css在内存中的相关处理 ，布局和渲染模块 : 负责页面的布局和效果的绘制(内存中的对象)】

• 分线程
  定时器管控和触发线程: 负责定时器的管理
  DOM事件管控和触发线程 : 负责事件的管理
  异步HTTP 请求线程 : 负责Ajax请求

  详细介绍

1. GUI渲染线程
   主要负责页面的渲染，解析HTML、CSS，构建DOM树，渲染成RenderObject树，布局和绘制等。
   当界面需要重绘或者由于某种操作引发回流时，将执行该线程。

当RenderObject树需要更新样式属性时，即发生重绘（Repaint）；
当RenderObject树中的元素规则尺寸，布局或显示隐藏等发生变化，即发生回流（reflow）

GUI渲染线程与JS引擎线程是相互排斥的
因为JS引擎线程在执行的过程中可能会发生重绘和回流，
所以GUI渲染线程执行时，JS引擎线程会被挂起，等待GUI渲染线程执行完毕之后，JS引擎线程执行
JS引擎线程执行时，GUI渲染会被挂起，当任务队列空闲时，主线程才会去执行GUI渲染。

2. JS引擎线程
   主要负责处理 JavaScript脚本，执行代码。
   也主要负责执行准备好待执行的事件（即定时器计数结束，或者异步请求成功并正确返回时，它们将依次进入任务队列，等待 JS引擎线程的执行）
   当然，该线程与 GUI渲染线程互斥，当 JS引擎线程执行 JavaScript脚本时间过长，将导致页面渲染的阻塞。

3. 定时器触发线程（定时器计时）
   负责执行异步定时器一类的函数的线程，如： setTimeout，setInterval。
   主线程依次执行代码时，遇到定时器，会将定时器交给该线程处理，当计数完毕后，事件触发线程会将计数完毕后的事件加入到任务队列的尾部，等待JS引擎线程执行。

4. 事件触发线程（将计数完毕或触发点击的事件【触发回调】加入callback queue）
   主要负责将准备好的事件交给 JS引擎线程执行。
   比如 setTimeout定时器计数结束， ajax等异步请求成功并触发回调函数，或者用户触发点击事件时，该线程会将整装待发的事件依次加入到任务队列的队尾，等待 JS引擎线程的执行。

5. 异步http请求线程
   负责执行异步请求一类的函数的线程，如： Promise，axios，ajax等。
   主线程依次执行代码时，遇到异步请求，会将函数交给该线程处理，当监听到状态码变更，如果有回调函数，事件触发线程会将回调函数加入到任务队列的尾部，等待JS引擎线程执行。

相对于单进程浏览器，多进程浏览器的优势

避免单个页面奔溃影响整个浏览器
避免第三方插件奔溃影响整个浏览器
多进程充分利用多核优势
方便使用沙盒模式隔离插件等流程，提高浏览器稳定性

稳定性解释：
Google Chrome将插件或是网络应用放在与浏览器本身不同的进程中。在一个渲染引擎中的崩溃并不会影响浏览器本身或是其他网络应用。这意味着操作系统可以并发的运行网络应用来提高响应速度，如果一个特定的网络应用程序或是插件停止响应时浏览器本身并不会被死锁。这也意味着我们可以在一个严格意义上的沙箱内运行渲染引擎进程，帮助减少发生错误时造成的损失。

可以让你在不需要重启浏览器的情况下终止任何停止响应网络应用或插件。

使用多进程意味着Google Chrome可以有自己的任务管理器，你可以通过右击浏览器标题栏打开。这个任务管理器可以让你跟踪每个网络应用和插件的资源使用率，而不是针对整个浏览器。

针对以上原因，Google Chrome浏览器的多进程构架与单进程浏览器相比有更强的健壮性，更快的响应速度，同时更安全。