threejs-loaders

このスキルを使用するタイミング

ユーザーが次の項目に言及した場合は、必ずこのスキルを使用してください。

• GLTFLoader、DRACOLoader、KTX2Loader、FBXLoader、OBJLoader、進捗とエラーの処理
• グローバルな進捗管理のための LoadingManager、HTTP キャッシュ制御のための Cache
• エクスポート：GLTFExporter、OBJExporter、HDR/KTX2 エクスポートパイプライン
• IES、UltraHDR、またはドキュメントの Addons Loaders に記載されているドメイン固有のローダー

重要：ローダーとテクスチャの違い

• threejs-loaders = ファイルを取得、デコード、解析して three オブジェクトにします。
• threejs-textures = 画像バッファーを取得した後の Texture／DataTexture のパラメーター、サンプリング、PMREM を扱います。

重要：ローダーと dev-setup の違い

• インポートパスの問題は threejs-dev-setup の対象です。このスキルでは、インポートが解決済みであることを前提とします。

トリガーとなるフレーズの例：

• 「GLTFLoader」、「DRACO」、「KTX2」、「LoadingManager」、「gltf をエクスポート」
• 「モデルの読み込み」、「エクスポート」、「進捗バー」

このスキルの使用方法

1. フォーマットに応じてローダーを選択します。可能であれば、PBR の相互運用には glTF を優先してください。
2. 複数アセットのバッチ処理には LoadingManager を設定し、onStart／onLoad／onProgress／onError を通知します。
3. glTF + Draco：DRACOLoader をインスタンス化し、デコーダーパスを設定して、現行ドキュメントに従い GLTFLoader.setDRACOLoader に接続します。
4. glTF + KTX2：Basis テクスチャを使用する場合は、トランスコーダーパスを指定して KTX2Loader を設定し、GLTFLoader に接続します。
5. エクスポート：往復処理の要件に合ったオプションで GLTFExporter を使用します。大規模なシーンやバイナリと JSON の違いにも注意してください。
6. セキュリティ：ユーザー提供の URL を読み込む場合は必ず検証し、クロスオリジンのアセットでは CORS について説明します。
7. 読み込み後：シーンを走査してマテリアル／メッシュを確認し、マテリアルの調整は threejs-materials に引き継ぎます。

examples/workflow-gltf-draco.md を参照してください。

ドキュメント一覧（公式）

ドキュメントのセクション	代表的なリンク
Core Loaders	https://threejs.org/docs/LoadingManager.html
Core Loaders	https://threejs.org/docs/GLTFLoader.html
Addons Exporters	https://threejs.org/docs/GLTFExporter.html
Addons Loaders	https://threejs.org/docs/DRACOLoader.html

拡張リスト：references/official-sections.md。

対象範囲

• 対象： ローダーおよびエクスポータークラス、マネージャー／キャッシュ、フォーマットの選択、Draco／KTX2 のプラグイン接続、エクスポートの基本。
• 対象外： サーバー側のトランスコードパイプライン、three のドキュメントの範囲外にある物理演算またはゲームエンジンのアセットツール。

よくある落とし穴とベストプラクティス

• Draco／KTX2 のデコーダーパスは、デプロイするファイルと一致している必要があります。パスに誤りがあると、onError によって表面化するまで気づかないことがあります。
• マージ後にテクスチャのインスタンスが重複する場合があります。マテリアルを複製する際は、renderer.initTexture の影響を考慮してください。
• エクスポーターはカスタムシェーダーを往復処理できない場合があります。制限を明記してください。
• 読み込んだシーンを置き換えるときは、GPU メモリーリークを防ぐため、必ずジオメトリとマテリアルを破棄してください。

ドキュメントとバージョン

ローダーおよびエクスポーターの API（特に GLTFLoader と DRACOLoader／KTX2Loader の接続方法）は、three.js のバージョンによって変わります。three.js docs の Loaders および Addons → Loaders / Exporters を参照してください。デコーダーの WASM パスはデプロイ環境によって異なり、ライブラリのバージョンだけで決まるものではありません。

エージェントの応答チェックリスト

このスキルに基づいて回答する場合は、次の点を優先してください。

1. https://threejs.org/docs/ の LoadingManager、GLTFLoader、または該当するフォーマットのページへのリンクを含めます。
2. 読み込み（このスキルの対象）と、デコード後のテクスチャ／マテリアルの調整（threejs-textures、threejs-materials）を区別します。
3. アセットが正常に読み込まれない場合は、Draco／KTX2 のデコーダーパスと CORS について説明します。
4. エクスポーターの制限（カスタムシェーダー、拡張機能など）を正直に説明します。
5. 読み込んだシーン全体を置き換えるときは、dispose() の使用を推奨します。

参考資料

• https://threejs.org/docs/#Loaders
• https://threejs.org/docs/LoadingManager.html
• https://threejs.org/docs/GLTFLoader.html
• https://threejs.org/docs/GLTFExporter.html

キーワード

英語： gltf、gltfloader、dracoloader、ktx2、loadingmanager、cache、exporter、asset pipeline、three.js

中文： GLTFLoader、ローダー、Draco、KTX2、エクスポート、アセット、進捗、three.js