游览器的进程和线程

进程和线程的区别

CPU

计算机的核心，其负责承担计算机的计算任务（能够比喻为一个工厂）。

进程

CPU资源分配的最小单位，是能拥有资源和独立运行的最小单位。（能够比喻为工厂车间，是一个工厂任务的环节）任一时刻，CPU老是运行一个进程，其余进程处于非运行状态。

线程

CPU调度的最小单位，是创建在进程基础上的一次程序运行单位，属于单个的程序执行流，是一个进程中代码的不一样执行路线。（能够比喻为一个车间的工人组成的一个个任务小组，不一样的执行流，协同完成一个任务）

总述

一个进程中能够拥有多个线程，同一进程下的各个线程之间共享程序的内存空间（包括代码段、数据集、堆等）及一些进程级的资源。虽然不一样进程之间也能够通讯，不过代价较大。（能够在电脑的任务管理器中查看进程）

浏览器是多进程的

概述

1. 浏览器之因此可以运行，是由于系统给它的进程分配了资源（cpu和内存）。
2. 每打开一个Tab页，就建立了一个独立的浏览器进程，每一个进程相互独立。（能够在Chrome的任务管理器上验证tab页进程）

多进程的好处

1. 不会由于一个tab页崩溃，致使其余tab页也被影响。
2. 相对于线程，进程之间是不共享资源和地址空间的，因此也不会存在太多的安全问题。

包含的进程种类

• Browser进程——浏览器的主进程，负责协调、主控，只有一个
• 第三方插件进程——每种类型的插件对应一个进程，仅当使用该插件时才建立
• GPU进程——最多一个，用于3D绘制等
• 浏览器渲染进程——也就是浏览器内核

Browser进程与渲染进程的通讯

1. 若是打开任务管理器，而后打开一个浏览器，就能够看到任务管理器中出现了两个进程，一个是主控进程，一个则是打开Tab页的渲染进程
2. 整个过程以下：

1.Browser进程收到用户请求，首先须要获取页面内容，随后将该任务经过RendererHost接口传递给Render进程。
2.Renderer进程的Renderer接口收到消息，简单解释后，交给渲染线程，而后开始渲染。
3.渲染线程接收请求，加载网页并渲染网页，这其中可能须要Browser进程获取资源和须要GPU进程来帮助渲染。
4.固然可能会有JS线程操做DOM（这样可能会形成回流并重绘）
5.最后Render进程将结果传递给Browser进程
6.Browser进程接收到结果并将结果绘制出来

• 如图所示
  

游览器内核是多线程的

常驻线程

• GUI 渲染线程——负责渲染浏览器界面，解析HTML，CSS
• JavaScript引擎线程——负责处理Javascript脚本程序
• 定时触发器线程——处理setInterval与setTimeout任务
• 事件触发线程——处理事件消息，控制事件循环
• 异步http请求线程——处理XMLHttpRequest异步请求

线程之间的关系

GUI渲染线程与JS引擎线程互斥

1. 因为js能够DOM，若是在修改这些元素属性同时渲染界面（即JavaScript线程和UI线程同时运行），那么渲染线程先后得到的元素数据就可能不一致了。
2. 所以为了防止渲染出现不可预期的结果，浏览器设置GUI渲染线程与JavaScript引擎为互斥的关系，当JavaScript引擎执行时GUI线程会被挂起，GUI更新会被保存在一个队列中等到引擎线程空闲时当即被执行

js为何会阻塞页面加载

1. 因为GUI渲染线程与JavaScript执行线程是互斥的关系，当浏览器在执行JavaScript程序的时候，GUI渲染线程会被保存在一个队列中，直到JS程序执行完成，才会接着执行。
2. 所以若是JS执行的时间过长，这样就会形成页面的渲染不连贯，致使页面渲染加载阻塞的感受

WebWorker与SharedWorker

• WebWorker——运行在web后台的线程，至关于js引擎向浏览器申请开一个子线程，由浏览器所开的，彻底受主线程控制，并且不能操做dom

• SharedWorker——是浏览器全部页面共享的，不能采用与Worker一样的方式实现，由于它不隶属于某个Render进程，能够为多个Render进程共享使用

• WebWorker与SharedWorker本质上就是进程和线程的区别，SharedWorker由独立的进程管理，WebWorker只是属于render进程下的一个线程

参考

• http://www.imweb.io/topic/58e3bfa845e5c13468f567d5
• http://www.cnblogs.com/mininice/p/4298952.html
• http://www.javashuo.com/article/p-ykilsgsq-gs.html