Логотип YeaHub

База вопросов

Собеседования

Тренажёр

База ресурсов

Обучение

Навыки

Войти

Выбери, каким будет IT завтра — вместе c нами!

YeaHub — это полностью открытый проект, призванный объединить и улучшить IT-сферу. Наш исходный код доступен для просмотра на GitHub. Дизайн проекта также открыт для ознакомления в Figma.

© 2026 YeaHub

Документы

Медиа

Назад
Вопрос про React: event loop

Если в useEffect сделать долгий fetch (например, на минуту), заблокирует ли это выполнение JS и интерфейс браузера? Почему он не ждёт ответа?

Вопрос проверяет понимание асинхронности в React и работы event loop в JavaScript.

Короткий ответ

Нет, долгий fetch не заблокирует интерфейс, потому что он выполняется асинхронно. JavaScript не "ждёт" ответа — запрос отправляется в фоне, а основной поток продолжает работать.

Длинный ответ

Причины, почему интерфейс не блокируется:

  1. fetch — асинхронная операция. Она выполняется браузерным API вне основного потока.

  2. Event loop обрабатывает колбэки после получения ответа. Пока ответ не пришёл, поток свободен для других задач (например, анимаций, кликов).

Пример в React:

useEffect(() => {
  fetch('https://example.com/slow-api')
    .then(response => response.json())
    .then(data => setData(data)); // Колбэк выполнится после ответа
}, []);

Что происходит под капотом:

  • Браузер отправляет запрос и освобождает основной поток.

  • Когда ответ приходит, колбэк (then) ставится в очередь микрозадач (microtask queue).

  • Event loop выполняет его, как только стек вызовов пуст (например, после завершения текущего рендера).

Если бы fetch был синхронным (как старый XMLHttpRequest с флагом async: false), он бы заблокировал интерфейс. Но современный fetch всегда асинхронен.

Важно:

  • Долгий fetch не блокирует интерфейс, но может замедлить другие запросы (если сервер или браузер ограничивает количество одновременных соединений).

  • Для отмены долгих запросов используйте AbortController.

Уровень

  • Рейтинг:

    3

  • Сложность:

    9

Навыки

  • React

    React

Ключевые слова

#event loop

Подпишись на React Developer в телеграм