Существует понятие 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Различия между макро и микрозадачами:
- Приоритет: Микрозадачи имеют более высокий приоритет по сравнению с макрозадачами. Все микрозадачи в очереди будут выполнены до начала следующего цикла Event Loop и до того, как будет взята новая макрозадача.
- Время выполнения: Микрозадачи выполняются непосредственно после текущей задачи и перед тем, как браузер получит возможность перерисовать страницу или обработать другие события, такие как ввод пользователя. Макрозадачи же разделяются циклами Event Loop.
- Источники: Макро- и микрозадачи поступают из разных источников. Например, таймеры (
setTimeout, setInterval) и I/O операции генерируют макрозадачи, в то время как обработчики промисов (then, catch, finally) создают микрозадачи.👉 @frontendInterview