EventLoop文章
浏览器是多进程 每个页面都是单线程

  • 一个浏览器只有一个 Browser Process用以协调浏览器的其它进程:
    1. 负责包括地址栏,书签栏,前进后退按钮等部分的工作;
    2. 负责处理浏览器的一些不可见的底层操作,比如网络请求和文件访问;

Renderer Process:负责一个 tab 内关于网页呈现的所有事情
主线程保证了网页的东西都有确定顺序执行 不会使代码同时执行 (比如同时操作dom导致可怕的竞态条件) ,不过会导致阻塞 比如渲染或用户交互 所以需要把异步任务 放到任务队列里,后面再回到主线程执行

事件循环

什么是宏任务和微任务?

宏任务:宿主(浏览器 node环境)发起的任务
微任务:JavaScript发起的任务
微任务总会在下一个宏任务之前执行,在本身所属的宏任务结束后立即执行

什么是事件循环

JavaScript 引擎等待宿主环境分配宏观任务,在操作系统中,通常等待的行为都是一个事件循环

  1. while(TRUE) {
  2. r = wait();
  3. execute(r);
  4. }

每个页面都有一个线程 一个线程里面 存在函数执行栈 事件队列 和微任务队列
同步任务 将依次在 函数执行栈执行 而异步任务等会进入微任务和宏任务等待下一轮调用

  • 进入页面 产生线程 函数执行栈 事件队列 和微任务队列
  • 依次函数执行栈执行同步任务
  • 异步任务进入微任务和宏任务等待同步任务调用完下一轮调用
  • 执行宏任务 检测是否存在微任务 存在先执行微任务 再执行宏任务

宏任务

  1. setTimeout()
  2. setInterval()
  3. requestAnimationFrame(浏览器)I/O(文件读取 请求...)
  4. setImemediate(node)
  5. Ui
  6. rendering(浏览器)

微任务

  1. await后函数
  2. process.nextTick(node)
  3. Promise.then()
  4. Object.observe[废弃]
  5. MutationObserver(浏览器)