Выбор ответа Middle Event loop обновлено
requestAnimationFrame против setInterval
Вопрос
Почему для JS-анимации лучше requestAnimationFrame, а не setInterval(step, 16)?
Попробуйте сами
Выберите вариант, и откроется разбор.
Показать ответ и разбор
Коротко
Правильный ответ: rAF вызывается раз перед каждой отрисовкой в такт экрану и спит в фоне. Браузер вызывает колбэки rAF на этапе подготовки кадра, ровно один раз на кадр и с частотой экрана (60, 120 Гц).
Варианты ответа
- rAF выполняется в отдельном потоке композитора и не нагружает главный поток
- rAF вызывается раз перед каждой отрисовкой в такт экрану и спит в фонеправильный ответ
setIntervalне умеет интервалы меньше 100 мс и округляет 16 мс вверх- rAF выполняется как микрозадача, поэтому всегда срабатывает раньше таймеров
Разбор
Браузер вызывает колбэки rAF на этапе подготовки кадра, ровно один раз на кадр и с частотой экрана (60, 120 Гц). С setInterval шаги не совпадают с кадрами: какие-то кадры получают два шага, какие-то ни одного, отсюда рывки, а в фоне таймер продолжает тратить ресурсы. rAF работает в том же главном потоке. setInterval умеет короткие интервалы. И rAF не микрозадача: он вызывается перед рендером, а не после каждой задачи.
Ответьте сами, а не прочитайте
В тренажёре вопрос попадёт в повторения и вернётся, когда начнёт забываться. Плюс билеты с зачётом: 20 вопросов, не больше 2 ошибок.