3D 首页开发记录 01：先决定它怎样出现

3D 首页最早面对的问题并不是“房间里放什么”，而是“它以什么身份进入网站”。如果 Canvas 是唯一入口，那么 WebGL 初始化失败、移动设备性能不足或用户开启减少动态效果时，整个个人档案都会一起消失。

先把入口拆成两种呈现

首页因此保留 Studio 与 Classic 两种同级呈现。桌面端、细指针、允许动效且 WebGL 可用时进入 Studio；移动端、粗指针、减少动态效果、初始化失败和 context loss 都直接使用完整 Classic 首页。Classic 不是等待 3D 的加载占位，而是一条独立、可阅读的正式路径。

Studio 的第一帧也不从黑屏开始。页面先显示 Blender 同镜头导出的海报，顶部导航立即可用；只有 Three.js 完成首个有效帧后，Canvas 才在原位置接管。这样资源下载和 GPU 初始化不会改变构图，也不会先闪过普通首页再突然覆盖。

Canvas 不拥有全部内容

这一步还确定了后来一直没有改变的边界：房间可以负责空间感、物件和镜头，但不能成为唯一导航或唯一内容表面。顶部的博客、摄影、书法、音乐和小游戏使用原生按钮；真正需要阅读或打开链接的内容继续由 DOM 承担，因此键盘、屏幕阅读器和浏览器原生行为仍然有效。

首版只是一个渐进式房间索引，模型和材质还很简单，但它先解决了更难返工的架构问题：一个 renderer、一份明确的能力判断、一张与 Canvas 同镜头的首屏海报，以及任何失败都能回到完整网站的退路。

图中已经是后续完成的房间，但它仍沿用第一阶段确立的进入方式：先有稳定首屏，再由同构图的实时场景接管。