如何详细解释JavaScript浏览器中的事件循环机制及其工作原理？

本文共计2163个文字，预计阅读时间需要9分钟。

首先明确一些基本概念。进程、线程和线程是系统分配的独立资源，是+CPU和资源分配的基本单位。进程是由一个或多个线程组成的。线程是进程的执行流，类似于CPU调度和分派的基准单位。

先来明白些概念性内容。

进程、线程

进程是系统分配的独立资源，是 CPU 资源分配的基本单位，进程是由一个或者多个线程组成的。

线程是进程的执行流，是CPU调度和分派的基本单位，同个进程之中的多个线程之间是共享该进程的资源的。

浏览器内核

浏览器是多进程的，浏览器每一个 tab 标签都代表一个独立的进程（也不一定，因为多个空白 tab 标签会合并成一个进程），浏览器内核（浏览器渲染进程）属于浏览器多进程中的一种。

浏览器内核有多种线程在工作。

GUI 渲染线程:

1. 负责渲染页面，解析 HTML，CSS 构成 DOM 树等，当页面重绘或者由于某种操作引起回流都会调起该线程。
2. 和 JS 引擎线程是互斥的，当 JS 引擎线程在工作的时候，GUI 渲染线程会被挂起，GUI 更新被放入在 JS 任务队列中，等待 JS 引擎线程空闲的时候继续执行。

JS 引擎线程:

1. 单线程工作，负责解析运行 JavaScript 脚本。
2. 和 GUI 渲染线程互斥，JS 运行耗时过长就会导致页面阻塞。