js的事件循环机制

js 的事件循环机制

参考链接

一个 CPU 可以有多个进程，一个进程可以有很多线程

浏览器是多进程的

1.浏览器包含了哪些进程

• 主进程

• 第三方插件进程

• GPU 进程

• 渲染进程

  就是我们所说的浏览器内核

  • 负责页面渲染脚本执行

2.浏览器内核渲染进程

渲染进程包括很多的线程:

• GUI 渲染线程

  • 负责 UI 渲染,布局和绘制
  • 页面需要重构和回流时,该线程就会执行
  • 与 js 引擎互斥,原因:防止渲染结果不可预期

• JS 引擎线程

  • 负责处理解析和执行 JavaScript 脚本程序
  • 只有一个 js 引擎线程(单线程)
  • 与 GUI 渲染线程互斥,防止结果不可预期

• 事件触发线程

  • 用来控制事件循环, settimeout,Ajax,点击事件
  • 当事件满足触发条件时,将事件放入 js 引擎所在的执行队列中

• 定时触发线程

  • settimeout,setinterval 所在的线程
  • 定时任务是由定时触发线程来计时的
  • 计时完毕后,通知事件触发线程

• 异步 HTTP 请求线程

  • 单独的一个线程,用来处理 Ajax 请求
  • 当请求完成时,通知事件触发线程

3.为什么 js 是单线程的

• 多线程的操作是需要加锁的, 如果加锁编码会变得很复杂
• 如果同时操作 dom 元素,在不加锁的情况下渲染结果会变得不可预期

4. 为什么 gui 渲染线程和 js 引擎线程互斥

• 因为 js 是可以操作 DOM 的, 如果在 js 操作 DOM 的过程中,GUI 渲染线程也在执行,以下情况:

  在同一时刻,js 删除了黑色的块,gui 同时也在画黑色的块,此时就会导致渲染和预期不一致

• 所以 GUI 渲染线程和 js 引擎线程互斥,当JS引擎线程执行时GUI渲染线程会被挂起，GUI 更新则会被保存在一个队列中等待JS引擎线程空闲时立即被执行。

5. 从事件循环(event loop)看 js 的运行机制

(挖坑快填)