The JavaScript event loop execution order, summarized in a simple manner

The simplified order

Everything in sync
Microtask queue
Task queue

Examples

Tasks

setTimeout, setInterval, setImmediate

Microtasks

Promises, queueMicrotask, MutationObserver

// Schedules a new microtas…


This content originally appeared on DEV Community and was authored by Leonard Ginters

The simplified order

  1. Everything in sync
  2. Microtask queue
  3. Task queue

Examples

Tasks

setTimeout, setInterval, setImmediate

Microtasks

Promises, queueMicrotask, MutationObserver

// Schedules a new microtask
queueMicrotask(() => console.log("microtask"));

// Schedules a new task
setTimeout(() => console.log("task"), 0);

console.log("main");
// Output order: main, microtask, task

Please note that this describes a really, really simplified perfect-world case. If you would like to find out more about this topic, I can highly recommend Jake Archibald's article on this topic.


This content originally appeared on DEV Community and was authored by Leonard Ginters


Print Share Comment Cite Upload Translate Updates
APA

Leonard Ginters | Sciencx (2021-11-18T19:50:08+00:00) The JavaScript event loop execution order, summarized in a simple manner. Retrieved from https://www.scien.cx/2021/11/18/the-javascript-event-loop-execution-order-summarized-in-a-simple-manner/

MLA
" » The JavaScript event loop execution order, summarized in a simple manner." Leonard Ginters | Sciencx - Thursday November 18, 2021, https://www.scien.cx/2021/11/18/the-javascript-event-loop-execution-order-summarized-in-a-simple-manner/
HARVARD
Leonard Ginters | Sciencx Thursday November 18, 2021 » The JavaScript event loop execution order, summarized in a simple manner., viewed ,<https://www.scien.cx/2021/11/18/the-javascript-event-loop-execution-order-summarized-in-a-simple-manner/>
VANCOUVER
Leonard Ginters | Sciencx - » The JavaScript event loop execution order, summarized in a simple manner. [Internet]. [Accessed ]. Available from: https://www.scien.cx/2021/11/18/the-javascript-event-loop-execution-order-summarized-in-a-simple-manner/
CHICAGO
" » The JavaScript event loop execution order, summarized in a simple manner." Leonard Ginters | Sciencx - Accessed . https://www.scien.cx/2021/11/18/the-javascript-event-loop-execution-order-summarized-in-a-simple-manner/
IEEE
" » The JavaScript event loop execution order, summarized in a simple manner." Leonard Ginters | Sciencx [Online]. Available: https://www.scien.cx/2021/11/18/the-javascript-event-loop-execution-order-summarized-in-a-simple-manner/. [Accessed: ]
rf:citation
» The JavaScript event loop execution order, summarized in a simple manner | Leonard Ginters | Sciencx | https://www.scien.cx/2021/11/18/the-javascript-event-loop-execution-order-summarized-in-a-simple-manner/ |

Please log in to upload a file.



There are no updates yet.
Click the Upload button above to add an update.

You must be logged in to translate posts. Please log in or register.

Related Posts