Web 3D Integration Patterns

Overview

This meta-skill provides architectural patterns, best practices, and integration strategies for combining multiple 3D and animation libraries in web applications. It synthesizes knowledge from the threejs-webgl, gsap-scrolltrigger, react-three-fiber, motion-framer, and react-spring-physics skills into cohesive patterns for building complex, performant 3D web experiences.

When to use this skill:

• Building complex 3D applications that combine multiple libraries
• Creating scroll-driven 3D experiences with animation orchestration
• Implementing physics-based interactions with 3D scenes
• Managing state across 3D rendering and UI animations
• Optimizing performance in multi-library architectures
• Designing reusable component architectures for 3D applications
• Migrating between or combining animation approaches