Чем отличаются `setTimeout(fn, 0)` и `Promise.resolve().then(fn)` с точки зрения порядка выполнения задач и приоритета очередей в event loop JavaScript?

Основное отличие

setTimeout(fn, 0) планирует fn как макротаск, а Promise.resolve().then(fn) планирует fn как микротаск. Эти две очереди имеют разные приоритеты в event loop JavaScript.

Порядок выполнения

Event loop обрабатывает очереди в таком порядке:

• Текущий синхронный код выполняется до конца
• Все микротаски обрабатываются (очередь микротасков полностью опустошается)
• Один макротаск берётся из очереди макротасков
• Цикл повторяется

Это означает, что микротаски всегда выполняются перед макротасками, независимо от того, когда они были запланированы.

Практический пример

Вывод:

Главный вывод

• Используй Promise.resolve().then(fn), когда нужно, чтобы fn выполнился как можно скорее, до любого рендеринга или I/O-колбэков
• Используй setTimeout(fn, 0), когда ты намеренно хочешь отложить работу на следующую итерацию event loop
• Примеры очереди микротасков: колбэки Promise, queueMicrotask()
• Примеры очереди макротасков: setTimeout, setInterval, I/O-события