用途：该技能用于构建高性能 3D 网页应用，基于 Three.js 这一跨浏览器 WebGL/WebGPU 库。适用于 3D 场景、模型、动画与可视化，WebGL/WebGPU 渲染与图形编程，交互式 3D 体验（游戏、配置器、数据可视化），相机控制、灯光、材质与着色器，加载 GLTF/FBX/OBJ 等 3D 资产与纹理，后处理效果（泛光、景深、SSAO），物理模拟、VR/XR 与空间音频，以及性能优化（实例化、LOD、视锥剔除）。
主要能力：按渐进式学习路径组织参考文档。Level 1 入门：场景搭建、基础几何体、材质、灯光、渲染循环。Level 2 常见任务：资产加载（GLTF、FBX、OBJ、纹理）、纹理类型与映射、相机（透视、正交、控制）、灯光与阴影、动画（剪辑、混合器、关键帧）、数学（向量、矩阵、四元数、曲线）。Level 3 交互与效果：射线拾取与变换、后处理（通道、泛光、SSAO、SSR）、控制器插件（轨道、变换、第一人称）。Level 4 高级渲染：PBR 与自定义着色器、性能（实例化、LOD、批处理、剔除）、节点材质（TSL 着色器图与计算）。Level 5 专项：物理与 VR/XR（Ammo、Rapier、Jolt）、专用加载器（SVG、VRML）、WebGPU 后端与计算着色器。
使用方式：快速开始模式为创建场景、相机与渲染器，添加物体与灯光，再运行动画循环。示例：const scene = new THREE.Scene(); const camera = new THREE.PerspectiveCamera(75, window.innerWidth/window.innerHeight, 0.1, 1000); const renderer = new THREE.WebGLRenderer(); renderer.setSize(window.innerWidth, window.innerHeight); document.body.appendChild(renderer.domElement); 随后添加几何体与材质、灯光，并在 animate 中调用 requestAnimationFrame 与 renderer.render(scene, camera)。
适用场景：3D 网页展示、交互式产品配置、数据可视化、游戏与 VR/XR 体验等。
限制：资料未提供具体收费、价格、平台支持范围与效果保证等信息；实际能力取决于 Three.js 版本与运行环境，WebGPU 等特性需浏览器支持。