标签: webgpu

2022 年秋季如何在 Firefox Nightly 中尝试 webGPU?

几周前我了解到新的 webGPU 标准即将成为现实,我当然想尝试一下。

我在多个来源中读到,如果您在about:config.

我尝试过,但即使如此,所有在线演示都不起作用。尝试在控制台中创建 webGPU 接口也会产生错误,就像我运行正常的 Firefox 版本一样。

您能否提供使其正常工作的详细步骤?

javascript firefox webgpu

9
推荐指数
1
解决办法
7781
查看次数

WebGPU 中的 storageBarrier 实际上是做什么的?

因此,我正在探索 WebGPU,并认为在其中实现基本神经网络将是一个有趣的练习。对 GPU 着色器编程和神经网络了解甚少,而且我对 WebGPU(w3.org/TR/webgpu 和 w3.org/TR/WGSL)的唯一参考是高度技术性的,这确实使它变得非常有趣。

不管怎样,不知何故,我已经把自己的方式搞乱了,以至于我实际上可以在小型网络上正确地执行前馈和反向传播,而且与我的 js cpu 实现相比,它的速度也非常快,尽管我确信我严重未充分利用硬件。

我已经到了想要尝试更大网络的地步,但在工作组和同步执行方面我有点不知所措。为了保持简单,我将把问题集中在前馈操作上:

目前,我正在调度与神经网络中最宽层相对应的线程数量。这个想法是,每个线程计算当前层中单个神经元的值,然后遇到障碍,然后每个线程一起移动到下一层,如此下去。

问题是,我只有两种设置屏障的方法 - 要么 workgroupBarrier() 要么结束执行并为下一层分派一堆新线程。

第一个的问题是它只能在工作组内工作,而且我只能在性能开始受到影响之前将工作组设置得这么大,因为据我了解,由于需要共享内存,只有单个 CU 可以在工作组上工作。如果我将工作组设置为 256x256,那么它将被切成多个块,单个 CU 必须在其余硬件闲置时进行处理。这限制了我的网络宽度,限制了单个 CU 可以容纳的线程数量,非常蹩脚。

第二个的问题非常明显 - 单独的调度速度很慢,比我测试的障碍慢得多。

现在,我根本不使用工作组共享内存,我想做的就是分派任意数量的线程并设置全局屏障。据我了解,WebGPU 没有全局屏障......除了 storageBarrier ?

即使在阅读了 w3.org 上关于它是什么的 2 句话之后,我仍然不知道它是什么,但我认为它与内存访问同步有关,而不是与全局屏障有关。我确实测试了它,结果是正确的,但是即使我从代码中消除了所有障碍,结果也是正确的,我猜这是 GPU 的 SIMT 执行风格的好处。但是,我不需要它“可能正确”,我需要保证正确,所以我需要一个全局屏障。是 storageBarrier 吗?如果不是的话那是什么?

额外问题 - 为什么工作组和派遣有 3 个维度,为什么不只有一个?

shader gpgpu webgpu wgsl

8
推荐指数
1
解决办法
1693
查看次数

无法在 Chrome v113 上启用 WebGPU

环境

  • 铬:v113
  • 操作系统:Ubuntu 23.04
  • 显示器:Nvidia RTX 3060 移动版

错误信息

WebGPU has been disabled via blocklist or the command line.
Disabled Features: webgpu
Run Code Online (Sandbox Code Playgroud)

全文来自 chrome://gpu

Graphics Feature Status
Canvas: Hardware accelerated
Canvas out-of-process rasterization: Disabled
Direct Rendering Display Compositor: Disabled
Compositing: Hardware accelerated
Multiple Raster Threads: Enabled
OpenGL: Enabled
Rasterization: Hardware accelerated
Raw Draw: Disabled
Video Decode: Hardware accelerated
Video Encode: Software only. Hardware acceleration disabled
Vulkan: Enabled
WebGL: Hardware accelerated
WebGL2: Hardware accelerated
WebGPU: Disabled
Driver Bug Workarounds
adjust_src_dst_region_for_blitframebuffer
clear_uniforms_before_first_program_use …
Run Code Online (Sandbox Code Playgroud)

google-chrome webgpu

8
推荐指数
1
解决办法
9328
查看次数

我在 Chrome DEV 中启用了 WebGPU,但它仍然不起作用

因此,我启用了 #enable-unsafe-webgpu 标志,甚至在打开 Chrome 时收到警告,“WebGPU 已启用,稳定性将受到影响”。然而,当尝试访问任何 WebGPU 示例网站时,我收到错误,指出我的浏览器不支持 WebGPU / WebGPU 未启用。我能做些什么?

我使用的是 Ubuntu 20.04 和 Chrome 版本 103.0.5056.0(官方版本)开发版(64 位)

谢谢

linux google-chrome webgpu

7
推荐指数
1
解决办法
1万
查看次数

wgpu-native 性能与 Vulkan

我一直在阅读有关 wgpu-rs 的内容,如果用于构建本机桌面应用程序,它会使用 Vulkan、Dx12、Metal 等。鉴于此,我们是否可以期望 wgpu-rs 和直接使用 vulkan 之间具有可比的性能?我是图形编程领域的业余爱好者,但一直在 Rust 中开发一款游戏,一旦 wgpu-rs 支持就能够构建 wasm 的想法非常有吸引力。

game-development rust vulkan webgpu

6
推荐指数
0
解决办法
1933
查看次数

无法读取 null 的属性“requestDevice”

我试图在 WebGpu 中渲染 Web GPU 着色器对象

并返回此错误

未捕获(承诺)类型错误:无法在 cube.html:28 处读取 null 的属性“requestDevice”

这是我对 requestDevice 的代码

(async () => {
 

    const [adapter, glslang] = await Promise.all([
        navigator.gpu.requestAdapter(),
        import("https://unpkg.com/@webgpu/glslang@0.0.7/web/glslang.js").then(m => m.default())
    ]);

    const device = await adapter.requestDevice();
    
    const canvas = document.getElementById("webgpu-canvas");
    canvas.width = window.innerWidth;
    canvas.height = window.innerHeight;

});
Run Code Online (Sandbox Code Playgroud)

任何想法来解决这个错误?

javascript webgpu

6
推荐指数
1
解决办法
379
查看次数

是否可以动态索引到 WebGPU 存储缓冲区?

我正在尝试编写一个 WGSL 着色器来读取存储在存储缓冲区中的八叉树。问题是,编译器不喜欢我正在计算的动态索引来访问存储缓冲区中的叶子。wgpu 产生以下验证错误:

thread 'main' panicked at 'wgpu error: Validation Error

Caused by:
    In Device::create_shader_module
    Function [1] 'get_voxel' is invalid
    Expression [68] is invalid
    The expression [67] may only be indexed by a constant
Run Code Online (Sandbox Code Playgroud)

八叉树的结构使得我可以在 GPU 上遍历它。这篇 NVIDIA 论文概述了该结构:https://developer.nvidia.com/gpugems/gpugems2/part-v-image-orient-computing/chapter-37-octree-textures-gpu

本质上,八叉树是一个由IndirectionGrids 组成的数组,每个八叉树在内存中都IndirectionGrid恰好有 8个。GridCell网格单元可以表示指向另一个网格的指针IndirectionGrid,也可以表示一些数据。

假设八叉树最深处代表 16x16x16 网格。我想在 7,7,7 点到达GridCell。我们知道 7,7,7 位于根的单元格 0 中IndirectionGrid,因为坐标的每个分量都小于中点。GridCell如果我们将坐标分量相加,我们就可以获得当前 的索引IndirectionGrid。因为我正在遍历一棵树,所以我在每个级别都执行此操作。下面是演示这一点的不完整代码。

引起问题的行是let cell = grid.cells[grid_index].data;

所以最终我的问题是,是否允许动态索引?有什么我可以改变的东西可以神奇地让它发挥作用吗?或者我需要了解更多关于 WebGPU 所做的权衡的背景信息吗?

thread 'main' …
Run Code Online (Sandbox Code Playgroud)

shader rust webgpu wgpu-rs

6
推荐指数
1
解决办法
2163
查看次数

WebGL2 和 WebGPU 之间的互操作

我的问题很简短:是否可以读取由 WebGL2 中的 WebGPU 创建的纹理或帧缓冲区?如果可以,如何读取?

我用谷歌搜索,我发现的唯一的就是这个错误:https://bugs.chromium.org/p/chromium/issues/detail? id=1200466,但我不能说,我完全理解它,或者文档在哪里。

总体目标是在 WebGPU 中创建渲染引擎,将其复制到 WebGL 纹理,并在为 WebAssembly 编译的 QML 应用程序中使用它。QML 尚不支持 WebGPU,目前还不清楚何时支持。

webgl webgpu

6
推荐指数
1
解决办法
130
查看次数

WebGPU 文本渲染

如果可能的话,如何在没有第三方库的情况下使用纯 WebGPU 渲染文本?

我还在学习WebGPU的过程中,了解不多,但是我找到了这个解决方案,但是它使用了第三方库

/* Canvas initialization */

const canvas = document.getElementById("canvas") as
HTMLCanvasElement;

/* WebGPU initialization */

const adapter: GPUAdapter = await navigator.gpu.
requestAdapter() as GPUAdapter;
const device: GPUDevice = await adapter.requestDevice() as
  GPUDevice;
}

/* Font initialization */

const fontParser = new FontParser(device, "fonts/RobotoRegular.ttf");

/* Text block to render */

const textBlock = new TextBlock(
    device, "Hello World", fontParser,
    options = {
    color = [0.6, 0.5. 0.6, 1.0],
    spacing = 2,
    width = 2,
    size = 4,
    isWinding …
Run Code Online (Sandbox Code Playgroud)

javascript text rendering webgpu

5
推荐指数
1
解决办法
956
查看次数

将 HDR 10 位 AVIF 图像加载到 WebGPU 中的 rgba16float 纹理中

问题

我正在尝试将 10 位 AVIF 加载到 rgba16float 纹理中,但它没有作为 HDR 图像加载(它不会渲染任何大于 1.0 的值)。我将在下面发布屏幕截图,但这就是我正在做的:

首先,我获取 HDR 图像并将其转换为 blob:

const assetRequest = await fetch(assetUrl);
const assetBlob = await assetRequest.blob();
Run Code Online (Sandbox Code Playgroud)

然后我从 blob 创建一个位图:

const bitmap = await createImageBitmap(
    assetBlob,
    {
        colorSpaceConversion: 'none',
        imageOrientation: 'flipY',
        resizeQuality: 'high'
    }
);
Run Code Online (Sandbox Code Playgroud)

最后,我创建一个纹理并将位图上传到其中:

const tex = device.createTexture({
    size: [bitmap.width, bitmap.height],
    format: 'rgba16float',
    usage: GPUTextureUsage.TEXTURE_BINDING | GPUTextureUsage.COPY_DST | GPUTextureUsage.RENDER_ATTACHMENT
});

device.queue.copyExternalImageToTexture(
    { source: bitmap },
    { texture: tex, colorSpace: 'display-p3' },
    { width: bitmap.width, height: bitmap.height }
);
Run Code Online (Sandbox Code Playgroud)

由于图像是等距柱状投影,我使用以下着色器将其转换为立方体贴图: …

hdr typescript webgpu avif

5
推荐指数
0
解决办法
309
查看次数