3D 首页开发记录 04：为什么浏览器里的模型像塑料
Blender 预览正常不代表 WebGL 会自动得到同样结果。最终方案把稳定光照烘进多张美术图集，并禁止浏览器再次改色。
这一阶段最明显的失败是：导入模型原本细节很多，到了浏览器却像塑料玩具。黑色椅子和唱机缩成一团，落地灯接近黑炭，墙面出现噪点，地板纹理又糊又大。原因不是模型突然变差，而是 Blender 与浏览器使用了两套不同的光照、色彩管理和材质能力。
不让浏览器重新猜一次光
最后采用稳定的 authored delivery：Blender 用固定暖光完成组合美术烘焙，桌子、工作站、唱机、躺椅、办公椅、落地灯、房间壳和生活物件分别写入多张 2K 图集；Three.js 将这些图集作为 KHR_materials_unlit / MeshBasicMaterial 直接显示，不再叠加一轮会改变结果的 tone mapping 与实时主光。
烘焙使用固定采样、去噪和间接光限制，墙面接缝与深色书柜另有亮度审计。地板也重新制作了 1K base/normal 与 512 roughness，木板宽度回到接近室内尺度，而不是把少量切割无限放大。
海报与实时帧必须说同一种颜色
同镜头海报和 GLB 共享一套显示等级，背景固定为克制的暖灰炭色。浏览器首帧接管时不改变曝光、色温或构图，用户才不会看到海报很好看、Canvas 一出现就发灰或发黑。
这套方案牺牲了部分动态光照自由，换来不同显卡和浏览器上的稳定质感。在这篇记录发布时，GLB 仍使用 PNG 中间纹理，KTX2 是下一阶段的传输与显存优化方向；它应该压缩同一份视觉结果，而不是借优化之名重新设计光照。
2026-08-28 更新：这个运输阶段已经完成。线上交付现使用 21 张带完整 mip 的内嵌 KTX2 纹理（18 张 ETC1S、3 张 UASTC）和本地 Basis 转码器；通过验证的场景文件为 9.62 MB，估算纹理显存约 48.47 MB，窗口玻璃也已移除会分配全屏离屏缓冲的 transmission 路径。PNG 只保留为可复现导出的源中间件。
