elite-performance

Optimize GSAP web animations to sustain 60fps and meet Core Web Vitals.

1|Updated Feb 3, 2026

Search Tags:#performance #optimization #animation #gsap #web-vitals #scrolltrigger

Ready to run

npx skills add https://github.com/RSHVR/elite-web-design --skill elite-performance

💬 Prompt for ChatGPT / Claude Chat▼

Please help me install this Agent Skill.
Skill: elite-performance
Source: https://github.com/RSHVR/elite-web-design/tree/main/skills/elite-performance
Command: npx skills add https://github.com/RSHVR/elite-web-design --skill elite-performance

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes references (resource) components.

What problem does it solve?

Performance optimization for premium animated websites to maintain smooth visuals and fast load times across devices.

Core Features & Use Cases

GPU-accelerated animation patterns and 60fps budgets
Memory management, cleanup, and efficient resource loading
Modular bundling, lazy loading, and content-visibility techniques for large UIs
Use cases include hero animations, scroll-driven interactions, parallax sections, and micro-interactions in complex dashboards

Quick Start

Run a quick audit on a sample project and apply the recommended 60fps and bundle targets to your animation code.

Frequently Asked Questions about elite-performance

High-intent search queries and answers about installing and using this skill.

FAQPage Schema

How do I optimize GSAP animations to maintain 60fps on complex web pages?▼

To maintain 60fps with GSAP animations, apply GPU-accelerated transforms and enforce strict animation budgets. This Skill audits timelines and provides modular bundling with clear performance fallbacks.

Why does my ScrollTrigger layout cause performance issues on mobile devices?▼

ScrollTrigger layouts cause performance issues when animations exceed memory limits or block rendering. This Skill implements memory cleanup patterns and lazy loading to sustain smooth scroll-driven interactions.

Can I use content-visibility to improve Core Web Vitals on large component trees?▼

Yes, content-visibility improves Core Web Vitals on large component trees by skipping rendering for off-screen elements. This Skill combines it with lazy loading and modular bundling to optimize loading.

What's the best way to manage memory cleanup for premium frontend animation projects?▼

The best way to manage memory cleanup is applying explicit destruction patterns for GSAP timelines and ScrollTrigger instances. This Skill provides cleanup logic to prevent memory leaks during navigation.

Does this approach work for parallax sections and large dashboard micro-interactions?▼

Yes, this approach works for parallax sections and dashboard micro-interactions by applying GPU-accelerated animation patterns. It ensures complex UIs maintain 60fps through progressive loading and modular bundling.