Three.js 电影感画面：色调映射、光影、雾与泛光

适用场景

游戏能玩，但截图没有说服力，就该用这一套。先按症状诊断，每个症状对应缺失的一层：

• 颜色发灰、黑位不黑：色彩管理坏了。颜色贴图被当成线性数据读取，或者伽马被套了两次。
• 高光糊成一片死白，像 2005 年的游戏：没有色调映射，超过 1.0 的亮度被直接截断。
• 金属发黑，其他东西都像塑料：没有环境贴图。PBR 材质得有东西可反射。
• 物体像飘着：没有阴影，或者阴影又糊又偏，看上去只是一团污渍。
• 世界空荡荡，远处一条清楚的边：没有雾，就没有空气透视。
• 灯、屏幕、魔法不够「烫」：没有泛光，或者自发光从没超过 1.0，泛光抓不到东西。
• 像在看 CAD 模型：默认 75° 视角，摄像机死死粘在角色身上，或者直接用 OrbitControls。

扁平着色、像素风、卡通渲染这类要求颜色和原画完全一致的风格，以及 2D 游戏，可以跳过，或者只做前两层。

性能账先算清：色彩管理、色调映射、环境光照和雾，每帧几乎零成本；一个阴影要把所有投影物体再画一遍；泛光和其他全屏效果按像素计费，手机的预算就是在这里花光的。这也正是每毫秒的性价比排序，所以按顺序加，60 fps 的 16.7 ms 用完就停。