GLB 模型发布到网站前应该检查什么？

把 GLB 模型发布到网站前，不要只检查“能不能打开”。一个模型可能在桌面查看器里正常，但放到网页上就出现加载慢、比例不对、贴图缺失、压缩扩展不兼容或移动端卡顿。

如果你在准备商品 3D 展示、作品集模型、Three.js 场景、配置器、AR 预览或游戏素材，可以用这份发布前清单先做检查。目标不是把模型修到完美，而是上线前抓住最容易出问题的地方。

1. 确认文件是否自包含

网页发布时，GLB 通常比文件夹形式的 glTF 更稳。GLB 可以把场景结构、二进制数据和贴图打包成一个文件；而 .gltf 可能引用外部 .bin、图片和材质资源。

如果你只上传 .gltf，但没有同步部署它引用的资源，模型在浏览器里就可能加载失败。发布前可以先放进 3D 模型查看，确认模型离开本地文件夹后仍能正常显示。

如果模型只有在你电脑上能打开，很可能是因为旁边还有贴图或 .bin 文件。交付给网站前，优先导出自包含 GLB。

2. 检查文件大小和页面预算

GLB 没有一个适用于所有场景的标准大小。首页首屏商品模型、详情页 3D 预览、内部设计评审、模型库缩略图，能接受的体积都不一样。

先问几个问题：

• 这个模型是否首屏加载？
• 是否面向移动端用户？
• 页面只加载一个模型，还是加载模型列表？
• 页面本身是否已经有大图、视频或重脚本？
• 模型未加载完时，用户是否还能操作页面？

如果 GLB 很大，可以测试压缩版本。但要记住，压缩会把一部分网络传输成本转移到 CPU 解码成本，不是体积变小就一定首帧更快。

3. 查看三角面和顶点数量

三角面数量影响渲染压力，顶点数量影响内存和处理成本。CAD 导出、扫描模型、雕刻模型经常包含远超网页展示需求的细节。

高面数不一定错误，但必须有理由。如果模型只是商品小预览、背景物体或移动端素材，就应该在视觉差异可接受的范围内降低几何复杂度。原始高精度模型要保留，网页发布版本可以更轻。

4. 检查边界尺寸和比例

比例错误会让模型看起来像“没加载”。它可能离相机很远、特别小、特别大，或者被近远裁剪面截掉。发布前要看边界尺寸和模型中心是否合理。

如果 bounds 异常，重点检查：

• 导出单位是否正确。
• 隐藏对象是否被一起导出。
• 原点是否离模型很远。
• 是否有空节点或辅助对象留在场景里。
• 是否有重复几何。

有些查看工具会自动适配相机，这会掩盖比例问题。因此最终仍然要在真实网页运行环境里打开一次。

5. 检查贴图和材质

贴图经常是 GLB 体积的大头。一个几何并不复杂的模型，可能因为塞了多张 4K 或 8K 图片而变得很重。网页模型的贴图尺寸应该匹配用户实际能放大的程度。

还要看材质：

• normal map 是否正常。
• 金属度和粗糙度是否保留。
• 透明材质排序是否能接受。
• 在网站灯光下是否太暗或太亮。

如果同一个模型在不同工具里看起来差异很大，可能是灯光、色彩管理、材质扩展或贴图支持不同造成的。

6. 测试压缩扩展兼容性

Draco 和 meshopt 都能减少模型体积，但运行时必须支持对应扩展并加载 decoder。比如 Three.js 的 GLTFLoader 支持常见 glTF 扩展，但压缩模型需要额外配置解码器。实现时应查看 Three.js GLTFLoader 文档。

不要只在压缩工具里看成功结果。压缩后的 GLB 必须在最终网页栈里实际加载成功，才算可以发布。

7. 导出截图做交付记录

PNG 预览图很适合放到工单、文档或审批流程里。很多时候，同事只需要确认外观，不需要拿到完整模型。对于私有商品或客户模型，截图也比原始文件更安全。

交付时最好同时记录：原始文件大小、压缩后大小、目标页面、查看器截图和已知限制。这样后续排查更容易。

发布前检查表

检查项	通过标准
文件打包	GLB 自包含，或 glTF 的外部资源已正确部署。
文件体积	与页面位置、设备和加载预算匹配。
几何复杂度	三角面和顶点数量有明确理由。
边界尺寸	模型比例、中心点和原点合理。
材质贴图	贴图尺寸、颜色和透明材质表现可接受。
压缩扩展	目标运行时支持对应 decoder。
浏览器测试	桌面和较弱设备都能稳定加载。

一句话总结

GLB 模型发布到网站前，应检查文件是否自包含、体积、三角面、顶点、边界尺寸、贴图材质、压缩扩展支持和真实浏览器表现。只有在目标网页里能稳定加载、外观正确、性能符合预算，才算准备好发布。