从浏览器多进程到JS单线程

最近在重看从输入URL到页面加载完成的过程，发现里面很多知识点自己当时学的很杂乱，浅显，现在属于对其中细节知识点的梳理，帮助自己加深记忆理解。（当时写那篇博客还不知道格式，写的脑壳痛，现在用markdown，可以解决很多格式问题，强烈打call）

一、区分进程和线程

1、二者的类比关系
— 进程是一个工厂，工厂有它的独立资源，不同的工厂之间相互独立；
— 线程是工厂中的工人，多个工人协作完成任务；
— 每个工厂内有一个或多个工人，工人之间共享这个工厂的空间。
完善概念：
*工厂的资源——》系统CPU给进程分配的独立的一块内存；
*工厂相互独立——》 进程之间相互独立；
*多个工人协作完成任务 ——》多个线程在某个进程中协作完成任务；
*工厂内有一个或多个工人——》 一个进程由一个或多个线程组成；
*工人之间共享工厂空间——》 属于同一进程的不同线程会共享进程内存空间中的全局区和堆，而私有的线程空间则主要包括栈和寄存器。
如果是windows电脑，可以打开任务管理器，看后台进程列表，可以看到每个进程的内存资源信息以及cpu占有率。
2、概念
教科书上最经典的一句话：进程是资源分配的最小单位，线程是CPU调度的最小单位。

进程：

---

进程，是计算机中的程序关于某数据集合上的一次运行活动，是系统进行资源分配和调度的基本单位，是操作系统结构的基础。
在早期面向进程设计的计算机结构中，进程是程序的基本执行实体；在当代面向线程设计的计算机结构中，进程是线程的容器。某进程内的线程在其它进程不可见。

线程:

---

线程，程序执行流的最小单元。
1、一个标准的线程由线程ID、当前指令指针（PC）、寄存器集合、堆栈组成。
2、线程有自己的堆栈和局部变量，但线程没有单独的地址空间，一个线程死掉就等于整个进程死掉；
3、一个线程可以创建和撤消另一个线程，同一进程中的多个线程之间可以并发执行。
4、由于线程之间的相互制约，致使线程在运行中呈现出间断性。线程也有就绪、阻塞和运行三种基本状态。就绪状态是指线程具备运行的所有条件，逻辑上可以运行，在等待处理机；运行状态是指线程占有处理机正在运行；阻塞状态是指线程在等待一个事件（如某个信号量），逻辑上不可执行。
5、每一个程序都至少有一个线程，若程序只有一个线程，那就是程序本身。在单个程序中同时运行多个线程完成不同的工作，称为多线程。

线程安全：概念比较直观。一般说来，一个函数被称为线程安全的，当且仅当被多个并发线程反复调用时，它会一直产生正确的结果。

线程安全条件：要确保函数线程安全，主要需要考虑的是线程之间的共享变量。属于同一进程的不同线程会共享进程内存空间中的全局区和堆，而私有的线程空间则主要包括栈和寄存器。因此，对于同一进程的不同线程来说，每个线程的局部变量都是私有的，而全局变量、局部静态变量、分配于堆的变量都是共享的。在对这些共享变量进行访问时，如果要保证线程安全，则必须通过加锁的方式。死锁问题
3、为何需要多进程（或者多线程），为何需要并发？

多线程：同一时刻执行多个线程。用浏览器一边下载，一边听歌，一边看视频，一边看网页。
多进程：同时执行多个程序。如，同事运行YY，QQ，以及各种浏览器。（这是比较浅显的用例子说明，真正理解原理又是balabala一堆，哭泣）

并发：并发是指两个或多个事件在同一时间间隔内发生。当有多个线程在操作时,如果系统只有一个CPU,则它根本不可能真正同时进行一个以上的线程，它只能把CPU运行时间划分成若干个时间段,再将时间 段分配给各个线程执行，在一个时间段的线程代码运行时，其它线程处于挂起状。.这种方式我们称之为并发(Concurrent)。并发性是指在一段时间内宏观上有多个程序在同时运行，但在单处理机系统中，每一时刻却仅能有一道程序执行，故微观上这些程序只能是分时地交替执行。（高并发涉及的知识点还有好多。。）
并发技术，就是可以让你在同一时间同时执行多条任务的技术。你的代码将不仅仅是从上到下规规矩矩的一条线执行。
并行：当系统有一个以上CPU时,则线程的操作有可能非并发。当一个CPU执行一个线程时，另一个CPU可以执行另一个线程，两个线程互不抢占CPU资源，可以同时进行，这种方式我们称之为并行(Parallel)。

4、线程、进程比较

结论：

---

1、健壮性——进程有独立的地址空间，一个进程崩溃后，在保护模式下不会对其它进程产生影响，而线程只是一个进程中的不同执行路径。线程有自己的堆栈和局部变量，但线程没有单独的地址空间，一个线程死掉就等于整个进程死掉，所以多进程的程序要比多线程的程序健壮。
2、花销——启动一个新的进程必须分配给它独立的地址空间，建立众多的数据表来维护它的代码段、堆栈段和数据段，这是一种”昂贵”的多任务工作方式。而运行于一个进程中的多个线程，它们彼此之间使用相同的地址空间，共享大部分数据，启动一个线程所花费的空间远远小于启动一个进程所花费的空间，而且，线程间彼此切换所需的时间也远远小于进程间切换所需要的时间。
3、通信机制——对不同进程来说，它们具有独立的数据空间，要进行数据的传递只能通过通信（IPC）的方式进行，这种方式不仅费时，而且很不方便。线程则不然，由于同一进程下的线程之间共享数据空间，我们可以通过全局变量来实现线程间通信，一个线程的数据可以直接为其它线程所用，这不仅快捷，而且方便。
node进程之间的通信方式
归结为一句话：“线程快而进程可靠性高”。线程有个别名叫“轻量级进程”，在有的书籍资料上介绍线程可以十倍、百倍的效率快于进程； 而进程之间不共享数据，没有锁问题，结构简单，一个进程崩溃不像线程那样影响全局，因此比较可靠。
（其实这块还有好多知识，知识好像越挖越多，以后再继续深入，参考资料在末尾给出链接。）

二、浏览器是多进程的

先上后台进程列表图：

由图可知：
* 浏览器是多进程的
* 浏览器之所以能运行，是因为系统给它的进程分配了资源
* 每打开一个tab页，就相当于创建了一个独立的浏览器进程（浏览器有自己的优化机制，有的多个tab页会被合并为一个进程，例如多个空白tab）
（自己电脑中的进程图非常不清晰明了，所以连图都用的大神的- -）
1、浏览器都包含哪些进程?
* - -
1)、Browser进程：浏览器的主进程（负责协调、主控、只有一个）,作用：
* 负责浏览器界面显示，与用户交互。如前进、后退等；
* 负责各个页面的管理，创建和销毁其他进程；
* 将Renderer进程得到的内存中的Bitmap，绘制到用户界面上；（涉及浏览器内核原理）
* 网络资源的管理、下载等。
2)、 第三方插件进程：每种类型的插件对应一个进程，仅当使用该插件时才创建
3)、 GPU进程： 最多一个，用于3D绘制
4)、 浏览器渲染进程（浏览器内核）（Renderer进程，内部是多线程的）：默认每个tab页面一个进程，互不影响。主要作用：
* 页面渲染，脚本执行，事件处理等。
2、浏览器多进程优势
相比于单进程浏览器，多进程有如下优点：
* 避免单个page crash影响整个浏览器
* 避免第三方插件 crash影响整个浏览器
* 多进程充分利用多核优势
* 方便使用沙盒模型隔离插件等进程，提高浏览器稳定性
3、浏览器渲染进程（重点）
浏览器的渲染进程是多线程的，页面渲染、JS执行、事件循环都在这个进程中执行。包含的线程有：
1)、GUI渲染线程
*负责渲染浏览器界面，解析HTML、CSS，构建DOM树和RenderObject树，布局和绘制等。
*当界面需要重绘（Repaint）或由于某种操作引发回流（reflow）时，该线程就会执行。
*注意，GUI渲染线程与JS引擎线程是互斥的，当JS引擎执行时，GUI线程会被挂起（相当于被冻结了），GUI更新会被保存在一个队列中，等到JS引擎空闲时，立即被执行。如果JS执行时间过长，这样会造成页面的渲染不连贯，导致页面渲染加载阻塞。
2)、JS引擎线程
*也称为JS内核，负责解析、处理javascript脚本程序。（例如V8引擎）
*JS引擎一直等待着任务队列中任务的到来，然后加以处理，一个Tab页（renderer进程）中，无论什么时候，都只有一个JS线程在运行JS程序。
3)、事件触发线程
*归属于浏览器而不是JS引擎，用来控制事件循环（可理解为，JS引擎忙不过来，需要浏览器另开线程协助）
*当JS引擎执行代码块，如setTimeOut时（也可来自浏览器内核的其它线程，如鼠标点击、AJAX异步请求等），会将对应任务添加到待处理事件队列的队尾，等待JS引擎的处理（当JS引擎空闲时才会去执行）。
4)、定时触发器线程
*传说中的setTimeOut和setInterval所在线程
*浏览器定时计数器并不是由Javascript引擎计数的（因为JavaScript引擎是单线程的，如果处于阻塞线程状态就会影响计数的准确），通过单独线程来计时并触发定时
5)、网络请求线程
*用户输入URL，从URL中解析到http协议，浏览器会新开一个线程请求

三、浏览器的Browser进程和浏览器内核（Renderer进程）的通信过程

1、Browser进程接收到用户请求，首先需要获取页面内容（譬如通过网络下载资源），随后将该任务通过RendererHost接口传递给Renderer进程

2、Renderer进程的Renderer接口收到消息，交给GUI渲染线程，开始渲染
*GUI渲染线程接收请求，加载网页并渲染网页，这其中可能需要Browser进程获取资源和需要GPU进程来帮助渲染
*当然可能会有JS线程操作DOM（这样会造成回流或重绘）
*最后Renderer进程将结果bitmap传递给Browser进程

3、Browser进程接收到结果并将结果绘制出来
（这一块涉及浏览器内核的原理，可以自行深入）

主要参考文章：从浏览器多进程到JS单线程，JS运行机制最全面的一次梳理