用途：该技能提供使用 Three.js 与 TresJS（Vue 3 集成）构建 3D HUD 界面的专业知识，主要面向 JARVIS AI 助手风格的全息显示，包括 3D 全息 HUD 面板、动画状态指示与仪表、系统可视化粒子效果、带 3D 元素的实时指标显示。风险等级标注为 MEDIUM，涉及 GPU 资源消耗、颜色解析潜在 ReDoS 与 WebGL 安全考量。
主要能力与原则：以 TDD 为先，先写测试再实现；关注性能，通过实例化、LOD 与高效渲染循环追求 60fps；强调资源管理，始终释放几何体、材质与纹理以防内存泄漏；通过 TresJS 集成 Vue 3 组合式 API；对颜色输入做校验以防 ReDoS；对 GPU 资源耗尽设置防护；为不支持 WebGL 的设备提供降级方案。
技术栈：three ^0.160.0+、@tresjs/core ^4.0.0、@tresjs/cientos ^3.0.0、postprocessing ^6.0.0。资料提示 0.137.0 之前版本存在 XSS 漏洞，0.125.0 之前存在 ReDoS 漏洞。
使用方式：以 TresCanvas 搭建场景，配合 TresPerspectiveCamera、OrbitControls 及自定义 HUD 组件；用 safeParseColor 校验十六进制或 rgb 颜色格式；用 shallowRef 持有 Three.js 对象并在 onUnmounted 中释放几何体与材质；用 TresInstancedMesh 批量渲染重复对象；用 @tresjs/cientos 的 Text 渲染文本并对内容做清洗。测试使用 vitest 与 @vue/test-utils，可运行 npm test、npm test -- --coverage、npm run typecheck、npm run test:perf。
性能与安全：资料给出几何体实例化、纹理图集、LOD、视锥剔除、对象池、RAF 优化与着色器简化等模式；安全方面覆盖 OWASP A05 注入与 A06 脆弱组件，并给出三角形与绘制调用上限的 GPU 资源保护示例。
限制：资料未提供具体安装命令、完整 API 文档、收费与平台支持信息，部分内容为示例代码，实际使用需结合项目环境验证。