intermediate

Composite

Комбинируйте layers на compositor, аккуратно анимируйте transform и opacity и избегайте лишнего layer promotion.

Compositing объединяет отрисованные слои в финальный кадр, часто на отдельном compositor thread. Анимация transform и opacity может обойти layout и paint, если элемент уже подходит для compositing. Продвижение слоя — компромисс: каждый слой ест память и может увеличить upload.

					.panel {
  will-change: transform; /* редко и снимайте после анимации */
  transition: transform 200ms ease, opacity 200ms ease;
}
				

Движение только через transform выглядит неверно, если должны меняться layout-связи с соседями. Работа compositor thread не бесплатна на слабых GPU.

На интервью: compositor-friendly свойства и почему will-change не бесплатен.

Типовые ошибки: will-change везде; transform-анимация при необходимости смены layout.

Компромисс: удобство против контроля — выбирайте механизм под вашу связность и бюджет производительности.

Чеклист:

  • Для motion — transform и opacity.
  • will-change кратко и локально.
  • Следите за числом слоёв и памятью.
  • Измеряйте jank, не только FPS.