threejs-loaders

Standardize loading of compressed GLTF assets with DRACO and KTX2 in Three.js.

Updated May 18, 2026
One-click install
npx skills add https://github.com/afovea/game-dev-skills --skill threejs-loaders-afovea
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: threejs-loaders
Source: https://github.com/afovea/game-dev-skills/tree/main/plugins/game-tech/skills/threejs-loaders
Command: npx skills add https://github.com/afovea/game-dev-skills --skill threejs-loaders-afovea

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

This skill solves the complexity of managing diverse 3D asset formats, compression techniques, and asynchronous loading states in Three.js projects, preventing common performance bottlenecks and runtime errors.

Core Features & Use Cases

  • Multi-Format Support: Handles GLTF, OBJ, FBX, STL, PLY, and HDR formats with optimized loading patterns.
  • Performance Optimization: Implements DRACO and KTX2 compression to significantly reduce geometry and VRAM usage.
  • Pipeline Management: Provides robust LoadingManager integration, asset caching, and retry logic for reliable production-grade asset delivery.

Quick Start

Use the threejs-loaders skill to implement a GLTFLoader with DRACO compression for a character model.

Frequently Asked Questions about threejs-loaders

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I load compressed GLTF models with DRACO in Three.js?

To load compressed GLTF models with DRACO in Three.js, you configure a GLTFLoader with a DRACOLoader instance to decode geometry. This skill standardizes that integration to ensure efficient memory and bandwidth usage during web rendering.

What is the best way to manage 3D asset loading pipelines in Three.js?

Managing 3D asset loading pipelines in Three.js requires a robust LoadingManager to handle caching, progress tracking, and retry logic. This skill provides architectural patterns to prevent performance bottlenecks and runtime errors during asynchronous asset delivery.

Does Three.js support loading multiple 3D formats like OBJ, FBX, and STL?

Three.js supports loading multiple 3D formats including OBJ, FBX, STL, PLY, and HDR. This skill implements optimized loading patterns for these diverse formats to streamline asynchronous loading states within your environment.

How do I reduce VRAM usage when loading 3D assets in a web environment?

To reduce VRAM usage when loading 3D assets, you implement KTX2 and DRACO compression techniques. This skill facilitates integrating these compressed formats to significantly decrease both geometry and texture memory overhead.

Why does my asynchronous Three.js asset loading pipeline fail on large models?

Asynchronous Three.js asset loading pipelines fail on large models due to missing error-resilient retry logic and unoptimized memory handling. This skill solves these complexities by providing robust LoadingManager integration and caching patterns.

Can I use KTX2 texture compression for Three.js environments?

You can use KTX2 texture compression in Three.js environments to optimize VRAM usage. This skill facilitates the integration of KTX2 formats alongside DRACO geometry compression to ensure efficient bandwidth usage.