GR
gsap-performance
Оптимизирует анимации GSAP для стабильных 60fps: использует transforms, batching и ScrollTrigger, избегая layout thrashing. Применяйте при запросах о производительности, FPS или плавности анимаций.
Что делает навык
Оптимизирует анимации GSAP для стабильных 60fps, снижая затраты на layout и paint. Skill обеспечивает плавность за счет использования трансформаций и прозрачности, избегая вызовов layout thrashing.
Когда применять
- Оптимизация GSAP-анимаций для достижения плавности 60fps
- Снижение вычислительной нагрузки (layout/paint cost) при анимации
- Решение проблем с дерганьем (jank) и производительностью
- Соблюдение лучших практик для быстрых анимаций
Как работает
- Предпочитать анимацию свойств transform (x, y, scaleX, scaleY, rotation, rotationX, rotationY, skewX, skewY) и opacity, так как они выполняются на уровне compositor.
- Избегать анимации свойств, вызывающих перерасчет макета (width, height, top, left, margin, padding), если их можно заменить на transform.
- Использовать GSAP-свойства x и y для перемещения элементов, так как они по умолчанию используют трансформации (translate), вместо left/top.
- Применять will-change для оптимизации рендеринга (упоминается в контексте оптимизации).
Примеры запросов агенту
Как оптимизировать GSAP анимацию для стабильных 60fps?
Почему моя анимация GSAP дергается (jank) и как это исправить?
Какие свойства GSAP лучше использовать для плавного движения элементов?
Описание составлено по SKILL.md навыка, сверено 05.10.2026.
Как подключить
1Скачать навык
# возьмите папку навыка «gsap-performance» из репозитория:
# https://github.com/greensock/gsap-skills
2Положить папку с
SKILL.md к навыкам ассистента# положите папку навыка туда, где ассистент ищет skills:
cp -r gsap-performance/ ~/.claude/skills/gsap-performance/
Навык — папка с файлом SKILL.md (описание + инструкции) и опциональными скриптами. Ассистент (Claude, Claude Code и совместимые) подхватывает его по описанию и следует шагам.