Выбор ответа Senior Анимации и жесты обновлено
Почему дёргается анимация
Вопрос
Анимация раскрытия карточки сделана через Animated без native driver. Во время анимации грузится и рендерится список. Анимация дёргается. Почему?
Попробуйте сами
Выберите вариант, и откроется разбор.
Показать ответ и разбор
Коротко
Правильный ответ: Кадры считаются на JS-потоке, а он в это время занят рендером списка. Без native driver каждый кадр требует работы JS-потока.
Варианты ответа
- Перегружен UI-поток: картинки нового списка декодируются на нём же
- Анимации в RN всегда дёргаются во время загрузки данных, это ограничение платформы
- У карточки не хватает
key, и React пересоздаёт её на каждом кадре - Кадры считаются на JS-потоке, а он в это время занят рендером спискаправильный ответ
Разбор
Без native driver каждый кадр требует работы JS-потока. Пока React рендерит список, кадры анимации задерживаются. Решения: native driver для transform/opacity, Reanimated для анимаций, считаемых на UI-потоке, или отложить тяжёлый рендер до конца анимации. Нативные анимации от загрузки данных не страдают, а ключи здесь ни при чём.
Ответьте сами, а не прочитайте
В тренажёре вопрос попадёт в повторения и вернётся, когда начнёт забываться. Плюс билеты с зачётом: 20 вопросов, не больше 2 ошибок.