在前面的文章中，我介绍了关于transformer.js的一些内容，快速连接：

• 1. 运行框架的可运行环境、使用方式、代码示例以及适合与不适合的场景
• 2. 关于pipe管道的一切
• 3. 底层架构及性能优化指南
• 4. 型接口介绍
• 5. Tokenizer 分词器接口解析
• 6. 处理工具介绍

再介绍接口一类的又有点繁琐，于是本文将深入探讨 Transformer.js 中的 ONNX 后端 - 也就是运行大模型的黑盒子，并讨论什么是“后端”，什么是 ONNX，如何配置 ONNX 后端，以及其他的一些常用后端选项。本文旨在帮助你理解如何高效地使用 Transformer.js，尤其是在深度学习推理任务中选择合适的后端以实现最佳性能。

复习一下：在前后端开发中的后端一般指服务器端，编程语言中的后端一般指语言执行的环境，大模型运行的后端指的是模型运行的环境或引擎

什么是“后端”？

在深度学习中，后端是指用于执行模型计算的底层引擎或框架。换句话说，后端是处理神经网络推理、矩阵运算等复杂计算的基础设施。在 Transformer.js 中，后端负责实际的推理计算，通过执行模型的数学操作来生成结果。后端的选择对于模型推理的效率、速度和硬件支持有直接的影响。

常见的后端包括：

• TensorFlow.js：支持 JavaScript 进行模型推理和训练，适用于 CPU 和 GPU。
• ONNX：一个用于运行预训练模型的开放标准，可以在各种硬件上高效运行。
• WebGPU/WebGL：适合在浏览器环境中加速图像或深度学习计算。
• 其他如 CPU 或 GPU 的计算引擎，如 XNNPACK 或 WebNN。

Transformer.js 通过提供多种后端支持，让用户能够灵活地在不同的硬件和环境下部署 Transformer 模型。

什么是 ONNX？

ONNX（Open Neural Network Exchange） 是一个开源的深度学习模型互操作格式。它由 Facebook 和微软联合推出，旨在提供跨框架的通用深度学习模型格式，使模型在多个框架和硬件之间轻松转换和运行。ONNX 支持主流的深度学习库，包括 PyTorch、TensorFlow、Keras 等，允许开发者轻松将模型导出到 ONNX 格式，并使用适配 ONNX 的推理引擎进行高效推理。

ONNX 的优势

1. 可移植性：ONNX 提供了跨平台的兼容性，可以在不同的环境和硬件上运行，比如从服务器迁移到边缘设备。
2. 高性能：ONNX 推理运行时（如 ONNX Runtime）经过高度优化，可以利用 CPU、GPU 和其他加速器进行推理，性能卓越。
3. 广泛支持：由于其开源和标准化特性，ONNX 得到了广泛支持和社区贡献，集成了多种硬件加速和框架插件。

在 Transformer.js 中，ONNX 后端允许我们加载和执行 ONNX 格式的预训练模型，从而充分利用其跨平台和高性能推理的优势。

ONNX 的使用与配置

为了在 Transformer.js 中使用 ONNX 后端，需要将模型导出为 ONNX 格式，并安装适用于 JavaScript 的 ONNX Runtime。下面介绍下如何配置 ONNX 后端。

第一步：导出模型为 ONNX 格式

要使用 ONNX 后端，首先需要将深度学习模型转换为 ONNX 格式。以 PyTorch 为例，可以通过以下代码将 PyTorch 模型导出为 ONNX：

import torch
import torchvision

# 假设有一个简单的模型，如 ResNet18
model = torchvision.models.resnet18(pretrained=True)
dummy_input = torch.randn(1, 3, 224, 224)  # 模型输入的示例张量

# 导出模型
torch.onnx.export(model, dummy_input, "resnet18.onnx", opset_version=11)

这里，将模型和输入数据导出为一个 resnet18.onnx 文件。

第二步：安装 ONNX Runtime for JavaScript

为了在 JavaScript 环境中使用 ONNX 模型，需要安装 ONNX Runtime。可以通过 npm 安装：

npm install onnxruntime-web

onnxruntime-web 是一个针对 Web 环境的优化版本，允许在浏览器中高效地加载和推理 ONNX 模型。

第三步：加载和推理 ONNX 模型

在安装完成后，可以使用 ONNX Runtime 来加载和执行 ONNX 模型。以下是使用 ONNX Runtime 的简单示例：

const ort = require('onnxruntime-web');

// 加载模型
async function runModel() {
  const session = await ort.InferenceSession.create('./resnet18.onnx');
  
  // 创建输入数据
  const input = new ort.Tensor('float32', new Float32Array(1 * 3 * 224 * 224), [1, 3, 224, 224]);
  
  // 进行推理
  const results = await session.run({ input: input });
  
  console.log(results);
}

runModel();

这段代码展示了如何加载 resnet18.onnx 文件，并将一个形状为 [1, 3, 224, 224] 的张量输入到模型中进行推理。ONNX Runtime 会利用合适的硬件加速进行推理，确保效率最大化。

ONNX 后端的优化配置

ONNX Runtime 提供了多种优化配置，例如可以利用 GPU 来加速推理。默认情况下，ONNX Runtime 会使用 CPU 运行，但可以显式指定后端设备：

const session = await ort.InferenceSession.create('./resnet18.onnx', {
  executionProviders: ['webgl']  // 也可以是 'cpu' 或 'webgpu'
});

在配置时可以选择执行提供程序，如 WebGL 或 WebGPU，从而在浏览器环境中充分利用 GPU 的计算能力。

其他后端

除了 ONNX 后端，Transformer.js 还支持其他后端，主要包括：

1. TensorFlow.js

TensorFlow.js 是另一个非常常见的后端，特别适用于在浏览器和 Node.js 环境中执行深度学习模型。它通过 TensorFlow 引擎提供强大的计算能力，并支持使用 GPU 加速推理。它还可以轻松地转换 TensorFlow 模型，适合那些已有 TensorFlow 生态的用户。

2. WebGL / WebGPU

WebGL 和 WebGPU 是专为在浏览器环境下进行计算优化的后端。它们提供对浏览器内 GPU 资源的直接访问，从而使模型推理更加快速。WebGPU 相较于 WebGL 是一个更新的标准，具有更强的性能和灵活性，尤其适合那些需要大规模并行计算的应用。

3. XNNPACK

XNNPACK 是一个高效的神经网络推理库，特别适合移动设备和低功耗环境。它在 Transformer.js 中可以作为 CPU 后端使用，以实现良好的性能和资源利用率。

4. WebNN

WebNN 是一个 JavaScript API，旨在为 Web 应用提供标准化的神经网络推理接口。它允许开发者利用底层硬件的加速器，如 GPU 和专用的 AI 芯片。WebNN 在浏览器中运行时可以直接利用系统的计算资源，从而提高推理性能。

总结

ONNX 后端是 Transformer.js 提供的一种高效且通用的推理解决方案，它的跨平台特性使得模型在不同环境之间轻松迁移成为可能。同时，ONNX Runtime 的优化使得模型推理变得更加快速和灵活。除了 ONNX 后端，Transformer.js 还支持 TensorFlow.js、WebGL/WebGPU、XNNPACK 等后端，使开发者可以根据实际需求选择最合适的解决方案。

由于onnx算是一种通用标准的模型结构，所以你可以将绝大多数的pytorch或者tensorflow的模型导出为onnx格式，huggingface的modal card里面的files目录也可以查看是否有onnx目录来确定是否支持在web里面跑

现在web运行大模型的调整可能还是在：加载模型耗时长+推理速度慢（webgpu还未普及），量化+优化（优化指南）可以一定程度的解决，但任重道远

2024-11-26 心情一般，目前正讨薪 - -！