Frontend | Вопросы собесов

В чём разница между макро и микро задачами ?

Спросят с вероятностью 10%



Существует понятие Event Loop (цикл событий), который отвечает за выполнение кода, сбор событий и обработку сообщений. В его контексте важную роль играют понятия макро- и микрозадач. Эти типы задач помогают понять, как обрабатываются асинхронные операции.



Макрозадачи (Macro-tasks):



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



Примеры:

✅ setTimeout

✅ setInterval

✅ setImmediate (Node.js)

✅ Запросы к серверу через XMLHttpRequest или fetch (не сам запрос, а обработка результата)

✅ I/O операции (в Node.js)



Микрозадачи (Micro-tasks):



Также управляются циклом событий, но они имеют более высокий приоритет, чем макрозадачи. Они выполняются сразу после завершения текущей исполняемой задачи и перед тем, как Event Loop перейдет к следующей макрозадаче. Это означает, что все они в очереди будут выполнены до начала выполнения следующей макрозадачи.



Примеры:

✅ Promise.then/catch/finally

✅ queueMicrotask

✅ MutationObserver



Различия между макро и микрозадачами:



1️⃣ Приоритет: Микрозадачи имеют более высокий приоритет по сравнению с макрозадачами. Все микрозадачи в очереди будут выполнены до начала следующего цикла Event Loop и до того, как будет взята новая макрозадача.

2️⃣ Время выполнения: Микрозадачи выполняются непосредственно после текущей задачи и перед тем, как браузер получит возможность перерисовать страницу или обработать другие события, такие как ввод пользователя. Макрозадачи же разделяются циклами Event Loop.

3️⃣ Источники: Макро- и микрозадачи поступают из разных источников. Например, таймеры (setTimeout, setInterval) и I/O операции генерируют макрозадачи, в то время как обработчики промисов (then, catch, finally) создают микрозадачи.



Понимание разницы между макро- и микрозадачами критически важно для понимания того, как обрабатываются асинхронные операции, что позволяет разработчикам более эффективно управлять асинхронным кодом, избегать блокировок и создавать более отзывчивые приложения.



👉 Можно посмотреть Примеры как отвечают люди на этот вопрос, или перейти к Списку всех вопросов на Frontend Developer. Ставь 👍 если нравится контент.



🔐 База собесов | 🔐 База тестовых