一. 前言
要理解浏览器的进程和线程，首先需要理解一句话：进程是CPU分配资源的最小单位，线程是CPU调度的最小单位。
应用程序在运行时，CPU会分配一块可独立运行的内存，即进程，他是应用程序运行的载体。进程一般由程序，数据集合和进程控制块三部分组成。程序用于描述进程要完成的功能，是控制进程执行的指令集；数据集合是程序在执行时所需要的数据和工作区；程序控制块包含进程的描述信息和控制信息，是进程存在的唯一标志；
线程是一种比进程还小的抽象，在早期的操作系统中并没有线程的概念，进程是能拥有资源和独立运行的最小单位，也是程序执行的最小单位，他相当于一个进程只有一个线程，进程本身就是线程。所以线程有时被称为轻量级进程。
后来，随着计算机的发展，对多个任务之间上下文切换的效率要求越来越高，就抽象出一个更小的概念--线程，一般一个进程会有多个线程。线程的特点是：线程廉价，线程之间切换的花销较小，启动和退出较快，对系统资源的冲击也比较小。
对于进程和线程有一个通俗的比喻：进程就像一个工厂，线程就像工厂中的员工，工厂与工厂之间相互独立，工厂中的员工相互协作完成任务，每个工厂至少都有一个员工，员工之间共享工厂的空间。
这段话对应的是：
1.工厂=进程=cpu分配的一块可独立运行的内存；
2.进程与进程之间相互独立；
3.进程中至少有一个线程；
4.进程中的所有线程共享同一空间；
5.进程中的线程相互协作；
二. 了解了进程和线程，现在具体了解下浏览器的进程和线程；
浏览器运行时会创建相关进程：
1. Browser进程，是浏览器的主进程，负责协调，主控，只有一个进程，浏览器打开时会创建这个进程；
作用：
(1)负责浏览器页面呈现（放大，缩小，关闭等），与用户交互，如前进后退；
(2)管理各个页面，负责创建，销毁其他进程。（如tab页的新建与关闭）；
(3)网络资源的管理，下载等。
2. 第三方插件进程：每种类型的插件只有一个进程，只有当插件运行时才会创建；
3. GPU进程：最多创建一个，用于3D绘制；
4. 浏览器渲染进程（Renderer进程），内部是多线程的，也是每个标签页所拥有的进程，互不影响，负责页面渲染，js执行，事件处理等。
每打开一个tab页都会创建一个Renderer进程，一般几个空tab页会合并成一个Renderer进程以节省资源。Renderer是多线程的，接下来学习下各个线程在页面中的作用。
线程包括：
1. 图形用户界面GUI渲染线程
· 负责构建HTML，css，构建Dom树，Renderer树，布局与绘制等。
· 当界面需要重绘（repaint）或由于某种操作引发回流（reflow）时，该线程就会执行；
2. JS引擎线程
· JS内核，也称js引擎（比如Chrome的V8引擎），负责处理执行js脚本。
· 等待任务队列任务的到来，然后加以处理，浏览器渲染进程无论什么时候都只有一个js引擎在运行js；
3. 事件触发线程
· 当js引擎执行代码块，如setTimeout时（也可以来自其他线程，如鼠标点击，ajax异步请求等），会将对应任务添加到事件线程中；
· 当对应的事件符合触发条件被触发时，该线程会把事件添加到待处理队列的队尾，等待js引擎的处理；
注: 所有在处理队列的任务都要等待JS引擎空闲时才会执行。
4. 定时器触发线程
· setTimeout和setInterval所在的线程；
· 定时任务不是在js引擎线程中进行的（会阻塞js的执行），而是另外开一线程进行计时。
· 及时完成时，即符合事件触发条件，后事件触发线程会把事件添加到大爱处理队列的队尾（定时器最小时间间隔为4ms）.
5. 异步http请求线程
· 在XMLHttpRequest连接后，通过浏览器开一个线程请求；
· 当检测到状态变更时，如果设置回调函数，异步线程就会产生状态变更事件，将这个事件推入到事件队列的队尾。
三. 浏览器内核进程中各线程的关系
GUI线程和JS引擎线程？
GUI线程负责将DOM渲染到页面上，JS引擎线程涉及到DOM的一些增删改的操作。如果两个线程同时运行，GUI线程渲染DOM的同时，进行一些增删改的操作，必将造成冲突（渲染结果与DOM操作结果不一致）。因此，这两个线程设计为互斥的关系。当GUI线程运行时，JS引擎线程处于冻结状态，同理，JS引擎线程运行时，GUI线程处于冻结状态。
注： 当JS执行较长时间时，页面就会出现卡顿现象，所以要尽量避免长时间执行的代码。
