Бесконечные микрозадачи против таймеров
Вопрос
Какой из вариантов заморозит вкладку: интерфейс перестанет отрисовываться и реагировать на клики?
// A
function loopA() { setTimeout(loopA, 0); }
loopA();
// B
function loopB() { Promise.resolve().then(loopB); }
loopB();
Попробуйте сами
Выберите вариант, и откроется разбор.
Показать ответ и разбор
Коротко
Варианты ответа
- Только A
- Оба
- Ни один, оба асинхронные
- Только Bправильный ответ
Разбор
Очередь микрозадач выполняется до конца, прежде чем цикл перейдёт к следующей задаче или отрисовке. В варианте B каждая микрозадача добавляет новую, очередь никогда не пустеет, и браузер не доходит ни до рендера, ни до обработки кликов. В варианте A каждый вызов это отдельная задача: между ними браузер обрабатывает ввод и рисует кадры. Нагрузка есть, но страница живая. «Асинхронность» не гарантирует отзывчивость: важно, в какую очередь попадает колбэк.
Ответьте сами, а не прочитайте
В тренажёре вопрос попадёт в повторения и вернётся, когда начнёт забываться. Плюс билеты с зачётом: 20 вопросов, не больше 2 ошибок.
Предыдущий вопрос
Долгая задача в главном потоке
Следующий вопрос
setImmediate и setTimeout внутри колбэка ввода-вывода