BOOTSTRAP · 单文件 HTML
单文件最小 Three.js 场景Minimal single-file Three.js scene
从空白 HTML 搭出可运行的 renderer、相机、灯光、一个 mesh 与动画循环，并处理 resize。
旗舰完整演示
可交互场景（拖拽旋转；部分演示支持键盘）。下方提示词用于让 Agent 生成同级成品。
预期产出 · Returns
一个完整的 index.html：打开本地静态服务即可看到旋转立方体；含 window resize 与 requestAnimationFrame 清理说明。
适合用在哪
第一次让 Agent 写 Three.js、或需要可双击打开的演示页时，用这个打底，避免一上来就堆特效。
容易踩的坑
- 直接用 file:// 打开时 ES module 可能失败，需本地静态服务。
- 忘记 resize 会导致画面拉伸。
提示词 · Prompt
请用「单个 HTML 文件」实现一个最小可运行的 Three.js 场景，要求：
1) 通过 esm.sh 或 unpkg 以 ES module 方式 import * as THREE from "three"；
2) 创建 WebGLRenderer（antialias: true）、PerspectiveCamera、Scene；
3) 添加 AmbientLight + DirectionalLight，放一个 BoxGeometry + MeshStandardMaterial 的 mesh；
4) 实现 animate() 循环旋转 mesh，并在 beforeunload 或页面隐藏时 cancelAnimationFrame；
5) 监听 window resize，更新 camera.aspect 与 renderer.setSize；
6) 在页面角落用固定定位显示 FPS 近似值（可选）。
不要引入 React/Vue。注释用中文，标明每个模块的职责。
Deliver one index.html with Three.js via ES modules (esm.sh/unpkg): renderer, perspective camera, lights, one rotating box, resize handler, and rAF cleanup. No frameworks. Chinese comments.