推荐一款可以在线可视化代码运行顺序的网站

Error loupe 可视化运行代码

event loop它的执行顺序：

  • 先执行同步，然后执行异步（微任务，宏任务）
  • 执行过程中同步代码直接执行，宏任务进入宏任务队列，微任务进入微任务队列
  • 同步执行完，检查微任务列表，有则依次执行，直到全部执行完，然后执行宏任务
  • 执行浏览器UI线程的渲染工作
  • 检查是否有Web Worker任务，有则执行
  • 执行完本轮的宏任务，回到2，依此循环，直到宏任务和微任务队列都为空

微任务包括：MutationObserver、Promise.then()或catch()、Promise为基础开发的其它技术，比如fetch API、V8的垃圾回收过程、Node独有的process.nextTick。

宏任务包括：script 、setTimeout、setInterval 、setImmediate 、I/O 、UI rendering

Last modification：March 25, 2023
© Allow specification reprint
如果觉得我的文章对你有用，请随意赞赏