Transformer.js
定义
Transformer.js 是一个用 JavaScript 编写的推理库,目标是把 Hugging Face 生态中的预训练 Transformer 模型搬到 Web 前端直接执行[3]。它与 Python 版 transformers 在功能上基本对应,开发者可以用非常接近的调用方式加载同一批预训练权重,而不必搭建后端服务[4]。库的定位是面向网页的机器学习工具,官方文档将其概括为在 Web 端提供主流模型能力[1]。
在依赖关系上,它本身不发明新的模型结构,而是承担模型加载、输入预处理与输出解析的调度角色,真正的张量计算交给 ONNX Runtime Web 完成[2]。因此运行环境的差别主要体现在后端选择上:浏览器内可用 WebAssembly 或 WebGPU,服务端与桌面 JavaScript 运行时同样可以复用同一份代码。
原理
库以流水线(pipeline)为核心抽象。调用时需要给出任务标识,例如情感分析或文本生成,再可选地指定模型标识与运行选项;传入任务名后,库会自动挑选适配该任务的默认模型并装配对应的前处理与后处理环节[5]。选项中可以声明设备为 CPU 或 GPU,默认走后端通用性更好的 WebAssembly,指定 webgpu 则改用 GPU 计算[5]。
一次推理大致经过如下环节:先把文本、图像或音频交给分词器或特征提取器转成数值张量,再由 ONNX 会话执行模型,最后把输出张量还原为标签、文本或音频等结果[2]。模型文件一般为 ONNX 格式,配套的配置文件、分词器文件与权重一并下载后初始化[2]。
执行后端有三种常见选择:WebAssembly 依托 CPU 运行,兼容性最好;WebGPU 面向现代浏览器提供 GPU 加速;WebGL 属于较早的 GPU 路径[2]。v4 版本将 WebGPU 运行时改写为 C++ 实现,并与 ONNX Runtime 团队合作在约 200 种模型架构上做了测试。
为压缩体积,部署前通常把权重导出为 ONNX 并做量化,常用 fp16 以及 q4、q8 等低位数格式,以换取更小的内存占用与下载量[6]。首次加载的模型会被缓存,后续调用可直接复用[7]。
发展历程
该项目由开发者 Xenova 创建,开源时间可追溯到 2023 年 2 月[8]。早期版本以 BERT、GPT-2、T5、Whisper 等架构为支持重点,覆盖掩码语言建模、文本分类、翻译、摘要、问答与语音识别等任务[9]。
2023 年 11 月前后的 2.7 版本加入了文本转语音能力,最初仅支持基于 SpeechT5 的单一模型,并规划了后续扩展[3]。该阶段发布的包名为 @xenova/transformers,代码仓库后来迁移到 Hugging Face 组织下[10]。
v3 版本并入 Hugging Face 官方项目,包名改为 @huggingface/transformers,并在原有的 WASM/CPU 支持之外增加 WebGPU/GPU 支持;旧包继续可用,但新模型与新特性只加入新包[10]。
2026 年 2 月 9 日发布的 v4 引入重写后的 WebGPU 运行时,使同一份代码可运行在浏览器、Node、Bun、Deno 等环境,并新增对 Mamba、多头潜在注意力、混合专家等结构的支持,同时加入 GPT-OSS、Olmo3 等模型。该版本还提供 WASM 运行时缓存开关与自定义请求函数等环境配置[11]。
应用
常见用法是在网页里完成文本处理任务,如情感分析、文本分类、翻译、摘要、问答与特征抽取,代码只需导入库并调用流水线函数[5]。语音方向可做自动语音识别与文本转语音,生成的音频数组可直接交给浏览器的音频接口播放[3]。
视觉与多模态场景亦有覆盖,例如图像分类、目标检测、图像分割、深度估计,以及为图片生成文字描述的图文转换任务[12]。由于推理在本地进行,需要处理敏感内容的页面可以把数据留在设备上,同时也能用于离线演示与浏览器扩展等形态[8]。
在工程实践中,推理常被放进 Web Worker,避免计算占用主线程导致界面卡顿;模型文件则缓存到浏览器存储中以减少重复下载[7]。
局限
模型体积与内存是首要限制。量化后的可用模型通常从数十兆到数百兆字节不等,任务越复杂体积越大,低配置设备可用空间明显受限,显存与系统内存共享时还会挤占显示所需资源[7]。首次下载是主要瓶颈,网络较慢时用户等待时间较长[7]。
后端可用性受浏览器与硬件影响。WebGPU 在部分浏览器与移动平台上才逐步可用,缺失时只能回退到 WebAssembly,速度差距明显[7]。WebAssembly 的多线程依赖跨源隔离所需的响应头,缺少时只能单线程运行,计算密集任务会明显变慢[13]。WebGPU 还存在算子覆盖不全的问题,未支持的操作可能退回 CPU 执行,形成混合路径[13]。
模型格式也构成约束:库依赖 ONNX 格式权重,并非 Hub 上所有模型都有对应导出,需要自行转换,有时还得处理算子兼容问题[14]。此外,WebGPU 首次运行存在着色器编译带来的启动延迟,需要预热或加载界面来掩盖[13]。
参见
-
Hugging Face —— Transformer.js 所属的项目组织与模型托管平台。
-
ONNX Runtime —— 库在 JavaScript 侧的推理执行引擎。
-
WebGPU —— 浏览器中提供 GPU 计算能力的接口,用于加速推理。
-
WebAssembly —— 浏览器内基于 CPU 的通用执行后端。
-
量化 —— 压缩模型体积、降低内存占用的常用手段。
-
Transformer 模型 —— 库所运行的主要神经网络架构。
参考资料
- Transformers.js documentation [引用日期2026-10-29]
- Transformers.js Models & Architecture [引用日期2026-10-29]
- infoq.com 上的网页 [引用日期2026-10-29]
- Web ML 库 Transformers.js 提供文本转语音功能 [引用日期2026-10-29]
- Running AI models in the browser with Transformers.js [引用日期2026-10-29]
- 把浏览器炼成“超级终端” [引用日期2026-10-29]
- How Transformers.js Runs 200+ ML Models in Your Browser Tab [引用日期2026-10-29]
- Transformers.js | AI 原生全景图 [引用日期2026-10-29]
- github.com 上的网页 [引用日期2026-10-29]
- github.com 上的网页 [引用日期2026-10-29]
- huggingface/transformers.js 4.0.0 on GitHub [引用日期2026-10-29]
- transformers-fork [引用日期2026-10-29]
- WebGPU vs WebASM: Browser Inference Benchmarks [引用日期2026-10-29]
- wllama vs Transformers.js for LLMs [引用日期2026-10-29]