About threejs-assets
A development skill for loading and optimizing 3D assets in Three.js projects. It guides teams through format selection, decoder setup, asynchronous loading states, memory-aware optimization, caching, and verification.
Key features
- 01Asset format and metadata inventory
- 02GLTFLoader decoder configuration
- 03Explicit loading, error, and retry states
- 04Texture and geometry optimization guidance
- 05Caching and scene instance cloning
- 06Asset loading verification checklist
Use cases
- 01Preparing models for web delivery
- 02Handling rapid model switching safely
- 03Reducing texture and transfer costs
- 04Validating animation and memory behavior
Install
Copy the command and run it in a terminal.
npx skills add https:/ / github.com/ cesartevisual/ threejs-skills --skill threejs-assetsAfter installing, type/threejs-assetsin Claude Code to confirm it loaded.
Details
From the project READMEAsset Loading and Optimization
Use the project's installed versions and existing architecture. These instructions supplement the user's task; they do not authorize unrelated changes or external actions.
Inventory format, dimensions, units, animation clips, material features, texture sizes, provenance, and transfer size. Prefer a web-ready glTF/GLB pipeline when conversion is acceptable. Preserve source files and semantic names needed by application logic.
Configure GLTFLoader with the decoders the asset actually requires. Match decoder/transcoder binaries to the installed libraries, resolve their URLs through the build's asset conventions, and detect KTX2 support against the active renderer. Do not assume a compressed file needs only a single network request.
Represent loading, ready, failure, and retry explicitly. Unknown content length calls for indeterminate progress. On navigation or rapid selection, guard stale async completions with a generation token or supported cancellation; release late results that no longer have an owner. A manager's progress percentage is not necessarily download-byte percentage.
Budget decoded GPU texture memory as well as transfer bytes. Consider resizing, mesh simplification, Meshopt/Draco, and KTX2/Basis individually; compare decode time and visual quality before accepting a pipeline. Preserve required animation, skinning, morph targets, and metadata.
Cache immutable source assets and clone scene instances appropriately; skinned models need skeleton-aware cloning. Define cache eviction separately from component unmount. For user uploads, limit size/complexity, handle external URI policy and malformed files, and revoke object URLs after their consumers finish.
Verify missing decoder files, failed textures, rapid model switching, nested deployment paths, representative animation clips, and memory after repeated replacement.
API reference
Consult the official documentation for exact signatures and revision-specific behavior. If documentation access is unavailable, inspect installed types/source and state any remaining uncertainty.