ByteNoteByteNote
3D 模型瘦身这一步,交给 glTF Transform 的命令行
字

字节笔记本

2026年10月28日 · 约 4 分钟读完

3D 模型瘦身这一步,交给 glTF Transform 的命令行

API中转
¥120

3D 模型文件动辄几十上百兆,直接塞进网页或者渲染流水线,谁都会被噎住。进引擎前的最后一步加工,交给 glTF Transform。它是 glTF 2.0 的 JavaScript/TypeScript SDK,浏览器和 Node.js 双端可用,2 千星、MIT 协议,核心包 @gltf-transform/core 已到 4.5.1,作者是 three.js 生态的熟面孔 Don McCurdy。官方给的关键词很提气:fast、reproducible、lossless,快速、可复现、无损。

glTF Transform 官网:f(📦) 到 📦 的加工函数

一、建模工具改创意,它改字节

README 里有一段定位讲得很透:建模工具适合对几何、材质、动画做艺术性修改,而 glTF Transform 管的是模型文件底层的确定控制,打包、拆分、优化这些活它最合适。数组索引和字节偏移这些烦人的细节由 API 自动管理,人只管说要什么。

包分四层:core 提供读写编辑的 API,extensions 管扩展,functions 把常见修改做成了现成函数,cli 则让这些函数直接作用在文件上,可以批处理。这个 cli 是流水线场景的杀手锏,一行命令压缩一批模型,不用打开任何建模软件。

二、代码长什么样

Node 侧配好 I/O、注册扩展和 Draco 依赖,读写就是一个 promise 的事:

typescript
import { NodeIO } from '@gltf-transform/core';
import { ALL_EXTENSIONS } from '@gltf-transform/extensions';
import draco3dgltf from 'draco3dgltf';

const io = new NodeIO()
  .registerExtensions(ALL_EXTENSIONS)
  .registerDependencies({
    'draco3d.decoder': await draco3dgltf.createDecoderModule(),
    'draco3d.encoder': await draco3dgltf.createEncoderModule(),
  });

const document = await io.read('model.glb');
const glb = await io.writeBinary(document);

除了 NodeIO 还有 WebIO 和 DenoIO,同一套 API 在浏览器、Node、Deno 三端通用,Web 端做在线模型查看器时可以直接在用户浏览器里完成压缩。

glTF Transform 仓库:2 千星的 glTF 2.0 SDK

三、放进出片流水线

3D 出片的资产环节基本可以固化成一条规矩:模型从建模工具导出 glTF 后,先用 glTF Transform 跑一遍批处理再进 Three.js。几何用 Draco 压一遍,纹理压缩一遍,冗余数据清一遍,体积常常能下来一个量级,加载和渲染的坑同时少一半。

对 agent 工作流,可复现这三个字是核心价值:优化是一段脚本而不是一次手工操作,模型更新后重跑脚本就行,结果可预期。这也是它和建模软件最大的区别,建模软件里没有「重跑一遍」这个概念。

下一篇是 GL Transitions,剪辑里那段转场效果的标准库。

相关文章

分享: