浏览器常驻线程

浏览器的内核是多线程的，它们在内核制控下相互配合以保持同步，一个浏览器至少实现三个常驻线程：javascript引擎线程，GUI渲染线程，浏览器事件触发线程。

1. javascript引擎是基于事件驱动单线程执行的，JS引擎一直等待着任务队列中任务的到来，然后加以处理，浏览器无论什么时候都只有一个JS线程在运行JS程序。

2. GUI渲染线程负责渲染浏览器界面，当界面需要重绘（Repaint）或由于某种操作引发回流(reflow)时,该线程就会执行。但需要注意 GUI渲染线程与JS引擎是互斥的，当JS引擎执行时GUI线程会被挂起，GUI更新会被保存在一个队列中等到JS引擎空闲时立即被执行。

3. 事件触发线程，当一个事件被触发时该线程会把事件添加到待处理队列的队尾，等待JS引擎的处理。这些事件可来自JavaScript引擎当前执行的代码块如setTimeOut、也可来自浏览器内核的其他线程如鼠标点击、AJAX异步请求等，但由于JS的单线程关系所有这些事件都得排队等待JS引擎处理。（当线程中没有执行任何同步代码的前提下才会执行异步代码）

---

看下这段代码，setTimeout是异步线程，需要等待js引擎处理完同步代码（while语句）之后才会执行，while语句直接是个死循环，js引擎没有空闲，不会执行下面的alert，也不会插入setTimeout。所以即使这个时候你把setTimeout的时间改成0，他还是不会执行。看下实例：

setTimeout(function(){ 

    console.log(123); 

    var s = new Date();

    var n = s.getTime();

    console.log(n); 

},0)

for (var i = 0; i < 50; i++) { 

    console.log(new Date().getTime()); 

};

---

js单线程

单线程的含义是js只能在一个线程上运行，也就是说，js同时只能执行一个js任务，其它的任务则会排队等待执行。

js是单线程的,并不代表js引擎线程只有一个。js引擎有多个线程，一个主线程，其它的后台配合主线程。

多线程之间会共享运行资源，浏览器端的js会操作dom，多个线程必然会带来同步的问题，所以js核心选择了单线程来避免处理这个麻烦。js可以操作dom，影响渲染，所以js引擎线程和UI线程是互斥的。这也就解释了js执行时会阻塞页面的渲染。

---

js消息队列

JavaScript运行时，除了一个运行线程，引擎还提供一个消息队列，里面是各种需要当前程序处理的消息。新的消息进入队列的时候，会自动排在队列的尾端。

单线程意味着js任务需要排队，如果前一个任务出现大量的耗时操作，后面的任务得不到执行，任务的积累会导致页面的“假死”。这也是js编程一直在强调需要回避的“坑”。

---

js任务

任务分为2种:

同步任务

异步任务

它们的区别是: 本段中的线程指的是js引擎主线程

同步任务：在主线程排队支持的任务，前一个任务执行完毕后，执行后一个任务,形成一个执行栈，线程执行时在内存形成的空间为栈，进程形成堆结构，这是内存的结构。执行栈可以实现函数的层层调用。注意不是按栈的出栈顺序来执行。

异步任务会被主线程挂起，不会进入主线程，而是进入消息队列，而且必须指定回调函数，只有消息队列通知主线程，并且执行栈为空时，该消息对应的任务才会进入执行栈获得执行的机会。

---

主线程执行的说明: 【js的运行机制】

（1）所有同步任务都在主线程上执行，形成一个执行栈。 

（2）主线程之外，还存在一个”任务队列”。只要异步任务有了运行结果，就在”任务队列”之中放置一个事件。 

（3）一旦”执行栈”中的所有同步任务执行完毕，系统就会读取”任务队列”，看看里面有哪些事件。那些对应的异步任务将结束等待状态，进入执行栈，开始执行。 

（4）主线程不断重复上面的第三步。

执行栈中的代码（同步任务），总是在读取”任务队列”（异步任务）之前执行。

---

事件和回调函数

消息队列可以响应IO事件，还有用户产生的事件（比如点击鼠标，页面滚动），只要指定了回调函数，就会进入消息队列，等待EventLoop轮询线程处理，是否可以进入主线程的执行栈。

消息和回调函数相互联系的含义：主线程读到消息，就会执行相应的回调函数；进入消息队列的消息，必须对应相应的回调函数，否则这个消息会被丢弃不会进入消息队列。

消息队列是一个先进先出的队列结构，这就决定了它的执行顺序，先产生的消息会被主线程先读取，会不会执行则会先检查一下执行时间，因为存在setTimeout等定时函数，这类事件产生的消息进入到消息队列，被执行的时机取决与它在队列中的位置和执行时间有关。【上文中使用setTimeout能够避免阻塞UI线程就是这个原因】。

---

EventLoop

主线程从”任务队列”中读取事件，这个过程是循环不断的，所以整个的这种运行机制又称为Event Loop（事件循环）。

简单说，浏览器的两个线程：一个负责程序本身的运行，称为”主线程”；另一个负责主线程与其他进程（主要是各种I/O操作）的通信，被称为”Event Loop线程”（可以译为”消息线程”）。

由于js是运行在单线程上的，所有浏览器单独开启一个线程来处理事件消息的轮询，避免阻塞js的执行。

异步代码的执行逻辑： 

每当遇到I/O的时候，主线程就让EventLoop线程去通知相应的I/O程序，然后接着往后运行，所以不存在等待时间。等到I/O程序完成操作，EventLoop线程把消息添加到消息队列，主线程就调用事先设定的回调函数，完成整个任务。

JavaIO中包括了网络IO，我们通常把http请求归类为网络IO.

js的ajax是new XMLHttpRequest()对象实现的，浏览器会新开一个线程来处理http请求，这就是ajax能够实现局部刷新的同时，还能响应用户交互的原因。

这也说明了在处理IO时，浏览器通常会新开启IO线程，这个属于我的推测，并没有查到对应的资料，因为IO涉及的广泛，这话也没错。