什么浏览器未来也能调用GPU运行AI模型?

什么浏览器未来也能调用GPU运行AI模型?

浏览器是我们日常生活中必不可少的工具之一,现在Ai大模型也开始慢慢的介入我们的生活。有很多专家训练好的模型,并不能运行在我们日常使用最多的浏览器中。

file

这意味着所有数据的处理都需要依赖开发Ai的服务器响应才能完成工作。使用的过程中你可能会与上千万的人同时争夺网络请求资源和漫长的响应时间。在一些场景中可以结合网络数据库跑本地算了,可以省下不少时间。

file

随着WebGPU的发布,浏览器可以释放设备的GPU能力来完成这些任务,从而显著提高性能。微软旗下的ONNX Runtime Web实现了一种可以在浏览器中运行AI模型的标准接口将其整合到WebGPU中。

梦兽编程认为基于NVIDIA AI 显卡提供Trt 技术实现

ONNX Runtime Web

ONNX Runtime Web 是一个 JavaScript 库,它允许开发者在网络浏览器中直接部署机器学习模型。这个库提供了多个后端支持,可以利用硬件加速来提高模型的运行性能。ONNX Runtime Web 的主要特点包括:

  1. 跨平台支持
  2. 在浏览器中提供高性能的机器学习推理使用了WebAssembly和WebGpu,WebAssembly在Cpu方面提供强劲算力,WebGpu则在Gpu方面。
  3. 模型转换和兼容性,会将多个机器学习框架都转成ONNX 格式统一标准。

快速上手

安装ONNX Runtime Web

csharp 复制代码
pnpm add onnxruntime-web

导入下载好的ONNX模型

目前下载ONNX模型市区有:ONNX Model Zoo、Microsoft Learn、PaddlePaddle 官方模型库、或者一些科研人员发布的论文中(因为还处于实验阶段)。

javascript 复制代码
import * as ort from 'onnxruntime-web';

fetch('path_to_your_model.onnx')
    .then(response => response.arrayBuffer())
    .then(buffer => {
        // 模型加载完成后的代码
        const modelBuffer = buffer;
        // 创建推理会话
        const session = new ort.InferenceSession(modelBuffer, (error) => {
            if (error) {
                console.error(error);
                return;
            }
            // 模型加载成功,可以进行推理
            console.log('Model loaded successfully');
        });
    });

准备输入数据

根据你的模型,准备输入数据。这通常涉及到创建一个与模型输入维度匹配的张量(Tensor)。

ini 复制代码
// 假设模型有一个输入,形状为 [1, 3, 224, 224]
const inputTensor = new ort.Tensor([1, 3, 224, 224], ort.float32);
// 填充输入数据,这里使用随机数据作为示例
for (let i = 0; i < inputTensor.length; i++) {
    inputTensor.data[i] = Math.random();
}

执行推理

使用加载的模型和准备好的输入数据执行推理。

ini 复制代码
const feeds = { inputName: inputTensor }; // 'inputName' 应替换为你的模型的实际输入名称
session.run(feeds).then(outputData => {
    // 输出数据处理
    console.log(outputData);
});

目前,适用于Mac、Windows、ChromeOS的Chrome 113和Edge 113以及适用于Android的Chrome 121默认已包含WebGPU。

这项技术虽然还处于早期阶段,但它为在浏览器中运行AI模型提供了新的可能性,尤其是在隐私保护方面,因为所有的计算都在本地完成,不需要服务器支持。

如果想了解更多前沿资讯关注梦兽编程哦!

本文使用 markdown.com.cn 排版

相关推荐
英俊潇洒美少年1 小时前
Vue2/Vue3 vue-i18n完整改造流程(异步懒加载+后端接口请求)
前端·javascript·vue.js
空中海7 小时前
第七章:vue工程化与构建工具
前端·javascript·vue.js
zhensherlock7 小时前
Protocol Launcher 系列:Trello 看板管理的协议自动化
前端·javascript·typescript·node.js·自动化·github·js
zhuà!7 小时前
element的el-form提交校验没反应问题
前端·elementui
龙猫里的小梅啊7 小时前
CSS(一)CSS基础语法与样式引入
前端·css
小码哥_常7 小时前
从0到1,开启Android音视频开发之旅
前端
渔舟小调7 小时前
P19 | 前端加密通信层 pikachuNetwork.js 完整实现
开发语言·前端·javascript
qq_12084093718 小时前
Three.js 工程向:Draw Call 预算治理与渲染批处理实践
前端·javascript
不会聊天真君64710 小时前
JavaScript基础语法(Web前端开发笔记第三期)
前端·javascript·笔记