threejs-imperative

name	threejs-imperative
description	Raw / imperative Three.js reference (vanilla `import * as THREE`, no React) — scene/camera/renderer setup, geometries, materials, lighting, textures, the animation loop, GLTF/loaders, custom GLSL shaders (ShaderMaterial), EffectComposer post-processing, and raycasting/interaction. Use for hand-written WebGL / GLSL work OUTSIDE React Three Fiber. For declarative React 3D in Next.js, use `threejs` (SK-007, R3F + Drei) instead.
license	UNCONFIRMED
metadata	{"vendored_from":"github:cloudai-x/threejs-skills@b1c6230","license_status":"NO LICENSE FILE upstream (README-only MIT claim; original upstream pinkforest/threejs-playground is 404). Retained for LOCAL PERSONAL REFERENCE ONLY — do NOT redistribute or publish. See NOTICE.md."}

In the ATLAS web-dev system: the raw-WebGL lane. SK-007 threejs (R3F + Drei, SSR-safe Next 16) is the DEFAULT for React 3D and owns the ship path; reach for THIS skill only to hand-write imperative Three.js / GLSL that R3F doesn't wrap (custom render loops, bespoke ShaderMaterial GLSL, EffectComposer passes, low-level raycasting) or to study the underlying API Drei abstracts. Depth must carry meaning — one 3D moment per page ([[principles]] signature-effect gate + reduced-motion fallback still apply).

⚠ License UNCONFIRMED — vendored with no upstream LICENSE file, for the user's local reference only; not for redistribution or shipping. Content is generic Three.js API usage, largely re-derivable from the official docs — prefer Context7 three docs when authority matters. See NOTICE.md.

Three.js (imperative) — reference index

Vendored topic references (raw/vanilla Three.js, r160+ API, three/addons/ import paths):

Topic	File	Covers
Fundamentals	reference/threejs-fundamentals.md	Scene / camera / renderer, Object3D hierarchy, coordinate systems, the animate() loop, resize
Geometry	reference/threejs-geometry.md	BufferGeometry, primitives, custom attributes, instancing
Materials	reference/threejs-materials.md	Standard/Physical/Basic materials, transparency, PBR
Lighting	reference/threejs-lighting.md	Ambient/directional/point/spot, shadows, environment
Textures	reference/threejs-textures.md	Loading, wrapping, UVs, mipmaps, color space
Animation	reference/threejs-animation.md	AnimationMixer, clips, clock-driven motion
Loaders	reference/threejs-loaders.md	GLTFLoader, DRACO, environment/HDR loaders
Shaders	reference/threejs-shaders.md	ShaderMaterial, GLSL uniforms/varyings, raw shaders
Post-processing	reference/threejs-postprocessing.md	EffectComposer, render passes (bloom, FXAA, custom)
Interaction	reference/threejs-interaction.md	Raycasting, pointer picking, controls

(Upstream README preserved as reference/_upstream-README.md.)

When to use this vs SK-007 threejs (R3F)

• Default → SK-007 threejs — declarative React Three Fiber + Drei, SSR-safe in Next 16. Drei already wraps most of the above (useGLTF, OrbitControls, shaderMaterial, @react-three/postprocessing).
• This skill → only imperative/vanilla Three.js or GLSL outside R3F, or to understand the primitives Drei abstracts. Don't hand-roll a render loop in a Next.js app when R3F will do it.

Reduced motion & performance

Gate autoplaying 3D with prefers-reduced-motion; cap renderer.setPixelRatio(Math.min(devicePixelRatio, 2)); dispose geometries/materials/textures on teardown; one meaningful 3D moment per page (signature-effect restraint, [[principles]]).