Микрозадачи против макрозадач: порядок

Две очереди, два ритма

Предыдущий урок зафиксировал, кто чем владеет: хост владеет циклом и очередями макрозадач; движок владеет очередью микрозадач. Этот урок делает порядок точным, потому что две очереди осушаются с совершенно разными ритмами.

• Макрозадачи (спецификация называет их просто tasks) — за оборот цикла выполняется ровно одна. Источники: колбэки setTimeout/setInterval, колбэки завершения I/O, сообщения MessageChannel/postMessage, сработавшие DOM-события, разобранные куски HTML. Выполнив одну, цикл не запускает следующую макрозадачу немедленно.
• Микрозадачи — вся очередь осушается после каждой макрозадачи и снова каждый раз, когда пустеет стек вызовов JavaScript. Источники: реакции Promise.then/.catch/.finally, jobs от queueMicrotask, продолжения await, колбэки MutationObserver.

Асимметрия — это вся суть. Макрозадачи нормированы — одна за оборот — чтобы цикл мог рендерить и обрабатывать ввод между ними. Микрозадачи исчерпывающи — осушаются до пустоты — чтобы целостная единица асинхронного продолжения (цепочка Promise) завершилась атомарно прежде, чем случится что-либо ещё. Браузерный обзор (browser/01-event-loop/04-microtask-starvation) показывает этот режим отказа на уровне рантайма; здесь мы привязываем его к механике очередей.

Канонический пример порядка

console.log("1: sync start");

setTimeout(() => console.log("4: macrotask (setTimeout)"), 0);

Promise.resolve()
  .then(() => console.log("3a: microtask one"))
  .then(() => console.log("3b: microtask two"));

queueMicrotask(() => console.log("3c: queueMicrotask"));

console.log("2: sync end");
// Вывод: 1 → 2 → 3a → 3c → 3b → 4

Пройдём точно. Синхронный скрипт и есть текущая макрозадача. Он сперва исполняется до конца: 1, затем 2. По пути он запланировал макрозадачу (setTimeout) и микрозадачи (.then и queueMicrotask). Когда стек скрипта пустеет, движок осушает очередь микрозадач в порядке FIFO: первый .then (3a) и queueMicrotask (3c) были поставлены во время синхронного прогона, поэтому идут первыми; обработчик 3a возвращается, что теперь урегулирует сцепленный Promise и ставит 3b — добавленный в то же осушение, — поэтому 3b выполняется до конца осушения. Только когда очередь микрозадач наконец пуста, хост выбирает следующую макрозадачу: 4.

Почему микрозадача, ставящая микрозадачу, опасна

Поскольку чекпоинт микрозадач осушает до пустоты, микрозадача, поставившая другую микрозадачу до своего возврата, обрабатывается в том же осушении, а не в следующем. Нет границы «следующего оборота», к которой можно сбежать. Повторите это — и очередь никогда не пустеет:

function spin() {
  Promise.resolve().then(spin); // перевзводится внутри того же чекпоинта
}
spin(); // замерзает: чекпоинт никогда не завершается, движок никогда не возвращается

Это microtask starvation (голодание микрозадач). Хост никогда не получает поток назад (движок застрял внутри PerformMicrotaskCheckpoint из урока 1), поэтому ни одна макрозадача не выполняется, ни один кадр не рисуется, ввод не обрабатывается. Сравните с самозацикленной макрозадачей — setTimeout(spin, 0) — которая перевзводится на очереди хоста, поэтому движок возвращается между итерациями и страница остаётся отзывчивой (просто занятой). Лекарство от starvation — всегда вставить в цепочку yield на уровне макрозадачи.

Специфика Node: process.nextTick и пофазное осушение

Если вы читаете Node-кодовую базу и process.nextTick срабатывает раньше Promise.resolve().then — это не баг и не причуда, а намеренная вторая очередь до Promise. Node усложняет картину двумя дополнительными правилами. Во-первых, колбэки process.nextTick выполняются в очереди, которая отдельна от очереди микрозадач Promise и осушается до неё. Поэтому в Node process.nextTick всегда опережает Promise.resolve().then. Во-вторых, цикл Node работает фазами (timers → pending callbacks → poll → check → close), и исторически Node осушал микрозадачи между фазами, а не после каждого отдельного колбэка — хотя начиная с Node 11 он осушает микрозадачи после каждого отдельного колбэка макрозадачи, приближаясь к браузерной семантике.

// В Node:
setTimeout(() => console.log("timeout"), 0);     // фаза timers (макрозадача)
setImmediate(() => console.log("immediate"));     // фаза check (макрозадача)
Promise.resolve().then(() => console.log("promise")); // микрозадача
process.nextTick(() => console.log("nextTick"));  // очередь nextTick — первая

// Порядок: nextTick → promise → (timeout|immediate, порядок между этими
// двумя не гарантирован из главного модуля)

Практический сеньорный вывод: никогда не полагайтесь на порядок setTimeout против setImmediate с верхнего уровня, но полагайтесь на то, что process.nextTick выполняется до микрозадач Promise. И осторожно: у process.nextTick та же опасность starvation, что и у цикла микрозадач — рекурсивный nextTick морит голодом цикл фаз ровно так же, как рекурсивный .then морит браузер.