企业官网建设流程全解析

Three.js资源加载 - GLTF、纹理、图像、模型、异步模式。用于加载3D模型、纹理、HDR环境或管理加载进度。

技能概述

下载地址：https://github.com/sickn33/antigravity-awesome-skills/tree/main/skills/threejs-loaders

threejs-loaders 技能提供了Three.js资源加载的全面指导，帮助开发者加载模型、纹理、HDR资源以及其他外部资源。

主要功能

• LoadingManager：协调多个加载器并跟踪进度
• 纹理加载：TextureLoader、CubeTextureLoader、HDR/EXR加载
• GLTF/GLB加载：加载3D模型和动画
• 其他模型格式：OBJ、FBX、STL、PLY等
• 异步/Promise加载：现代异步加载模式
• 缓存管理：资源缓存和自定义资源管理器

触发条件

在以下情况下应该调用此技能：

• 需要在Three.js中加载模型、纹理、HDR资源或其他外部资源
• 任务涉及GLTFLoader、TextureLoader、加载进度或异步资源协调
• 管理场景资源而不是直接创作几何体或着色器

常用加载器

• TextureLoader：加载图像纹理
• GLTFLoader：加载GLTF/GLB 3D模型
• RGBELoader：加载HDR环境贴图
• CubeTextureLoader：加载立方体贴图
• FBXLoader：加载FBX模型
• OBJLoader：加载OBJ模型

压缩格式支持

• Draco压缩：使用DRACOLoader加载压缩几何体
• KTX2纹理：使用KTX2Loader加载压缩纹理
• Meshopt压缩：使用MeshoptDecoder加载压缩模型（r183）

性能优化

• 使用压缩格式：Draco用于几何体，KTX2/Basis用于纹理
• 渐进式加载：加载时显示占位符
• 延迟加载：只加载需要的资源
• 使用CDN：更快的资源交付
• 启用缓存：THREE.Cache.enabled = true

限制说明

• 仅在任务明确匹配上述范围时使用此技能
• 不要将输出作为环境特定验证、测试或专家审查的替代品
• 如果缺少所需的输入、权限、安全边界或成功标准，请停止并请求澄清