生成 WebNN 原生 JavaScript

原生 JavaScript 能为 WebNN 应用提供最小的包体积，非常适合对包大小敏感的部署场景。然而，与 Transformers.js  或 ONNX Runtime Web  等更高层的框架相比，手动编写 WebNN 代码需要投入大量的开发工作。

WebNN 社区通过提供代码生成工具来应对这一挑战，这些工具可将现有的机器学习模型自动转换为经过优化的 WebNN JavaScript，同时兼顾性能和极小的包体积开销。

包体积与开发效率

在构建基于 Web 的 ML 应用时，开发者面临一个关键的权衡：

• 高层库（Transformers.js 、ONNX Runtime Web ）可实现快速开发，但包体积较大
• 原生 WebNN JavaScript 占用空间最小，但需要大量手动编码
• 生成的 WebNN 代码 兼具两者之长：自动化开发，并且包体积经过优化

模型到代码转换

目前，WebNN 生态系统提供三种主要的代码生成方式，这些工具可将训练好的 ML 模型直接转换为精简的 WebNN 原生 JavaScript：

ONNX2WebNN 

• 适用场景：自动化工作流、CI/CD 流水线、批量处理
• 优势：成熟的 Python 生态系统、命令行自动化
• 使用场景：在开发流水线中转换单个或多个模型

Model2WebNN 

• 适用场景：交互式开发、快速原型设计、TS/JS 集成
• 优势：支持 Web UI、CLI 和库 API，支持 TFLite，基于浏览器的隐私保护
• 使用场景：直接在浏览器中或通过 CLI 转换单个模型，并确保数据完全私密

WebNNUtils/OnnxConverter 

• 适用场景：生产环境部署、复杂模型优化
• 优势：高级图分区、模型重排序、Microsoft Edge 团队支持
• 使用场景：需要借助 CPU/NPU 加速实现优化 WebNN 部署的企业级应用

代码到代码转换

将其他框架中现有的 ML 代码转换为精简的 WebNN 原生 JavaScript：

Python 到 WebNN 原生 JavaScript

当前状态：🚧 待办

将基于 Python 的 ML 代码（尤其是 PyTorch/TorchScript）直接转换为 WebNN JavaScript，同样是 WebNN 开发者所需要的。这种方式将能够实现：

• TorchScript → WebNN JavaScript 转换
• 自定义算子映射，将复杂的 Python ML 逻辑转换为 WebNN
• 针对 Web 部署的自动优化

该功能需要投入大量开发工作，目前尚不可用。Python ML 框架与 WebNN JavaScript 之间的差距仍是社区积极开发的领域。

入门

1. 评估你的需求：包体积限制、隐私需求、开发工作流、性能要求
2. 选择你的工具：CLI 自动化（ONNX2WebNN）、高级优化（WebNNUtils/OnnxConverter）或浏览器界面（Model2WebNN）
3. 准备你的模型：确保 ONNX 兼容性并针对 Web 部署进行优化
4. 生成并测试：转换你的模型，并在目标环境中验证性能
5. 部署并监控：集成生成的代码，并监控真实环境中的性能

WebNN 代码生成生态系统为在 Web 应用中部署优化的 ML 推理提供了灵活的选择，同时保留了原生 JavaScript 的性能优势。