motion-craft

Use GSAP ScrollTrigger with the useGSAP hook to build scroll-driven animations in React and Next.js. This standardizes sequences and transitions while applying performance guidelines like GPU acceleration across marketing sites and product tours.

Integrate GSAP SplitText and DrawSVG with Next.js by importing motion-craft patterns and applying the useGSAP hook. This provides ready-made recipes for text effects and vector animations, ensuring robust component-level motion without conflicting with React rendering cycles.

Yes, you can use GSAP ScrollSmoother and Observer for production-grade web animations in React. The system supports these plugins alongside MotionPath and MorphSVG to build enterprise-grade animation systems for product tours and marketing sites.

GSAP animation performance issues in Next.js often stem from ignoring GPU acceleration and will-change guidelines. Apply production-grade motion patterns that standardize component-level rendering, optimize scroll triggers, and prevent layout thrashing during scroll-driven sequences.

Yes, you need to install the gsap package separately to use motion-craft recipes. Once installed, import the motion-craft patterns to begin implementing ScrollTrigger-based animations and text effects within your React or Next.js project.