Когда добавляются задачи в очередь microtask?

Question

Задачи попадают в очередь microtask после выполнения Promise, queueMicrotask или MutationObserver. Они выполняются сразу после завершения текущего стека вызовов и перед следующей macrotask. Поэтому microtask имеют более высокий приоритет. Это влияет на порядок выполнения кода и отрисовку.

YeaHub · Accepted Answer

Microtask — часть механизма event loop, который определяет порядок выполнения асинхронного кода.1) Когда создаются microtaskMicrotask добавляются при:Выполнении Promise.then, catch, finally.Вызове queueMicrotask.Использовании MutationObserver.Пример:Promise.resolve().then(() => {
  console.log("microtask");
});
2) Когда они выполняютсяОпределение: Microtask queue — очередь задач, которая выполняется сразу после завершения текущего стека вызовов, но до следующей macrotask.Порядок:Выполняется текущий код.Выполняются все microtask.Затем следующая macrotask.3) Отличие от macrotaskMacrotask:setTimeoutsetIntervalсобытия DOMMicrotask:PromisequeueMicrotaskПример:setTimeout(() => console.log("macrotask"));
Promise.resolve().then(() => console.log("microtask"));
Результат:microtask
macrotask
4) Почему это важно для React и браузераMicrotask могут выполняться перед отрисовкой.Большое количество microtask может задержать repaint.Это влияет на производительность.Вывод: microtask добавляются при работе Promise и подобных механизмов и выполняются сразу после текущего кода, раньше macrotask.