---
name: three
description: Build browser-based Three.js and WebGL scenes, animations, and interactive 3D visualizations with a small vanilla JavaScript starting point.
---

# Three.js

Use this skill for browser 3D scenes, WebGL visualization, camera and lighting setup, asset loading, or animation loops. Start with the smallest scene in `templates/basic-scene.html`, then add geometry, materials, lights, and controls only as required.

## Core choices

- Use `PerspectiveCamera` for natural 3D views and `OrthographicCamera` for technical or isometric views.
- Keep animation time-based with `Clock` or elapsed timestamps.
- Dispose geometries, materials, and textures when scenes are replaced.
- Use GLTF/GLB for external models and keep assets local when reproducibility matters.
- Prefer instancing and level of detail when object count becomes the bottleneck.

The template uses a CDN for a quick standalone demo. Pin a Three.js version for production.