#blog
Сегодня - статья о сравнении анимаций в CSS и JavaScript. Внутри есть наглядные интерактивные визуализации описанного, советую заглянуть. А если тезисно про суть:
- Поток выполнения: CSS-анимации работают в отдельном потоке композитора и не блокируются кодом, а JS-анимации — в основном потоке и «замирают» при нагрузке.
- Свойства: Не все анимируемые свойства ведут себя одинаково. Те, что не вызывают перерисовок макета (transform, opacity) отработают плавно даже в JS.
- Исключение для JS: Библиотеки на базе WAAPI (например, Motion) работают так же плавно, как CSS, в отличие от классических (GSAP), которые теряют синхронизацию времени при тормозах.
- Правило выбора: Всегда приоритет нативному CSS. JS-библиотеки подключайте только для уникальных эффектов (морфинг, сложная физика), недоступных в CSS.
Статья: https://www.joshwcomeau.com/animation/css-vs-javascript/
Post #119
124