什么浏览器未来也能调用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 排版

相关推荐
汉堡大王95271 小时前
用 Trae Work 自动化任务,6 分钟生成一份前端生态周报
前端·javascript·人工智能
深圳佛手1 小时前
安装DeepSeek Harness npx @deepseek-ai/dsh web 长时间没反应,安装失败,如何解决?
前端
Csvn2 小时前
事件循环与渲染时机:一文吃透宏任务、微任务和 rAF
前端
章鱼小丸子逃跑中2 小时前
【2025最新版】如何将fnm与node.js安装在D盘?【保姆级安装及人性话理解教程】
前端·javascript·npm·node.js
Larcher2 小时前
从 SDD 到可交付:我如何用规范驱动 AI 做出一个 Chrome 翻译插件
前端·后端·架构
suaizai_3 小时前
AI Agent如何懂你:四层能力拆解
java·前端·人工智能
invicinble3 小时前
把握前端项目的核心(vibecoding)
前端
0end13 小时前
AI Agent 学习笔记(三):上下文工程(下)—— KV Cache、提示词设计与 Agent Skills
前端·aigc·ai编程
CAD老兵3 小时前
在浏览器里对比 DWG/DXF 图纸 —— @mlightcad/cad-diff-viewer
前端·javascript·github
JasonYin3 小时前
AI 定义的 H5移动端 开发规范,直接抄作业!
前端