threejs-loaders

SKILL.md

Asset loading for 3D models, textures, HDR environments, and progress tracking in Three.js.

Supports multiple formats: GLTF/GLB (primary), OBJ+MTL, FBX, STL, PLY, and HDR/EXR environment maps with optional DRACO geometry and KTX2 texture compression

LoadingManager coordinates multiple loaders with progress callbacks, onLoad/onError handlers, and unified asset tracking across the scene

Texture configuration covers wrapping modes, filtering, anisotropic sharpening, color space management, and repeat/offset/rotation transforms

Async/Promise patterns with helper functions for loading single or multiple assets in parallel, plus custom caching and asset manager implementations

Error handling includes retry logic, fallback URLs, timeout protection, and graceful degradation with placeholder meshes during load

Three.js Loaders

Quick Start

import * as THREE from "three";
import { GLTFLoader } from "three/addons/loaders/GLTFLoader.js";

// Load GLTF model
const loader = new GLTFLoader();
loader.load("model.glb", (gltf) => {
  scene.add(gltf.scene);
});

// Load texture
const textureLoader = new THREE.TextureLoader();
const texture = textureLoader.load("texture.jpg");