目录
浏览器的进程模型
何为进程？
程序运⾏需要有它⾃⼰专属的内存空间，可以把这块内存空间简单的理解为进程。
每个应⽤⾄少有⼀个进程，进程之间相互独⽴，即使要通信，也需要双⽅同意。
何为线程？
有了进程后，就可以运⾏程序的代码了。
运⾏代码的单位我们称之为「线程」。
⼀个进程⾄少有⼀个线程，所以在进程开启后会⾃动创建⼀个线程来运⾏代码，该线程称之为主线程。
如果程序需要同时执⾏多块代码，主线程可以启动更多的线程来执⾏代码，所以⼀个进程中可以包含多个线程。
浏览器有哪些进程和线程？
浏览器是⼀个多进程多线程的应⽤程序（
可以在浏览器的任务管理器中查看当前的所有进程
）
浏览器内部⼯作极其复杂，为了避免相互影响，减少连环崩溃的⼏率，当启动浏览器后，它会⾃动启动多个进程。
其中，最主要的进程有：
-
浏览器进程：主要负责界⾯显示、⽤户交互、⼦进程管理等。浏览器进程内部会启动多个线程处理不同的任务。
-
⽹络进程 ：负责加载⽹络资源。⽹络进程内部会启动多个线程来处理不同的⽹络任务。
-
渲染进程 ：（本文重点讲解的进程）渲染进程启动后，会开启⼀个
渲染主线程
，主线程负责执⾏
HTML
、
CSS、JS 代码。 默认情况下，浏览器会为每个标签⻚开启⼀个新的渲染进程，以保证不同的标签⻚之间不相互影响。
渲染主线程是如何⼯作的？
渲染主线程是浏览器中最繁忙的线程，需要它处理的任务包括但不限于：
-
解析
HTML
-
解析
CSS
-
计算样式
-
布局
-
处理图层
-
每秒把⻚⾯画
60
次
-
执⾏全局
JS
代码
-
执⾏事件处理函数
-
执⾏计时器的回调函数
-
……
要处理这么多的任务，主线程遇到了一个避不开的难题：如何调度任务？
例如：
-
我正在执⾏⼀个
JS 函数，执⾏到⼀半的时候⽤户点击了按钮，我该⽴即去执⾏点击事件的处理函数吗？
-
我正在执⾏⼀个
JS 函数，执⾏到⼀半的时候某个计时器到达了时间，我该⽴即去执⾏它的回调吗？
-
浏览器进程通知我
“
⽤户点击了按钮
”，与此同时，某个计时器也到达了时间，我应该处理哪⼀个呢？
-
……
渲染主线程的解决方案：排队
1. 在最开始的时候，渲染主线程会进⼊⼀个⽆限循环
2. 每⼀次循环会检查消息队列中是否有任务存在。如果有，就取出第⼀个任务执⾏，执⾏完⼀个后进⼊下⼀次循环；如果没有，则进⼊休眠状态。
3. 其他所有线程（包括其他进程的线程）可以随时向消息队列添加任务。新任务会加到消息队列的末尾。在添加新任务时，如果主线程是休眠状态，则会将其唤醒以继续循环拿取任务
事件循环（消息循环）
相关问题
何谓异步
代码在执⾏过程中，会遇到⼀些⽆法⽴即处理的任务，⽐如：
-
计时完成后需要执⾏的任务
——
setTimeout
、
setInterval
-
⽹络通信完成后需要执⾏的任务
—
XHR
、
Fetch
-
⽤户操作后需要执⾏的任务
—
addEventListener
如果让渲染主线程等待这些任务的执行时机达到，就会导致主线程⻓期处于 「阻塞」的状态，从⽽导致浏览器「卡死」
渲染主线程承担着极其重要的⼯作，⽆论如何都不能阻塞！
比如用户操作了页面，但是相应的渲染任务却被阻塞，就会在用户眼里造成卡死的假象。因此，浏览器选择
异步
来解决这个问题。
JS为什么会阻塞渲染
首先浏览器拿到一个HTML文件到渲染成页面会经过HTML 解析、样式计算、布局、分层、绘制、分块、光栅化、画、这几个流程的处理。
主线程在HTML 解析的过程中有一个细节，就是如果遇到 script 标签会停止解析 HTML，转而等待 JS 文件下载好，并将全局代码解析执行完成后，才能继续解析 HTML。
渲染任务后期会交给合成线程处理，合成线程处理好后会将其处理结果包装成任务丢到任务队列中排队
主线程在执行当前任务后才会去完成任务队列的任务。
总结：
JS执行和渲染都是任务，主线程在执行JS的时候渲染任务在任务队列中排队，JS的执行事件即排队时间即阻塞时间
JS 中的计时器为什么无法精确计时？
本质上
跟上一个问题是一样的，定时任务由
定时触发器线程异步触发后将异步任务的回调包装成任务丢入到异步任务队列，而
异步任务队列中任务的执行时间直接受主线程当前正在执行任务的执行时间影响
任务队列与优先级
过去把消息队列简单分为宏队列和微队列，这种说法⽬前已⽆法满⾜复杂的浏览器环境，取⽽代之的是⼀种更加灵活多变的处理⽅式。
根据 W3C 官⽅的解释，现在的做法是给每个任务加上任务类型标记。
同类型的任务必须在同⼀个队列，不同的任务可以属于不同的队列（青菜、萝卜可以分别放两个框里，也可以放一个框里，但是把青菜或萝卜放在多个框里不行）。
规范只声明了浏览器必须有⼀个微队列，微队列的任务⼀定具有最⾼的优先级，必须优先调度执⾏。其他任务队列的数量和顺序由浏览器厂商自主实现，所以不同浏览器可能存在差异。