Three.js Material Systems

When to Use

Use this skill when:

• Setting up materials for 3D objects
• Optimizing material performance on mobile
• Creating custom shader materials
• Managing material memory and reuse
• Implementing PBR workflows

Core Principles

1. Material Reuse: Share materials across meshes to reduce draw calls
2. Mobile-First Materials: Use simpler materials (MeshLambert/MeshPhong) on mobile
3. Texture Efficiency: Minimize texture count and use atlases
4. Shader Optimization: Write efficient shaders, avoid branching
5. Proper Disposal: Dispose materials and textures to prevent leaks
6. Parameter Updates: Use material.needsUpdate sparingly