WebGPU Compute Shader出现非预期结果求助

根源分析 #

尽管你仅指定id.x == 0的线程写入resultBuffer，但高负载场景下GPU的计算任务调度可能出现隐式线程重执行或内存访问竞态：

• 当计算负载饱和时，GPU可能复用线程组或重新调度任务，导致id.x == 0的线程被多次触发，重复写入缓冲区；
• 若未对缓冲区访问做显式同步，内存操作的可见性可能出现延迟，导致旧值或重复写入值被读取。

修复措施 #

1. 强制计算任务同步 #

在提交计算命令后，显式等待队列完成所有任务，避免后续操作读取未完成的计算结果：

commandEncoder.end();
const commandBuffer = commandEncoder.finish();
device.queue.submit([commandBuffer]);
// 等待队列执行完毕再读取缓冲区
await device.queue.onSubmittedWorkDone();

2. 约束缓冲区访问权限 #

创建resultBuffer时，仅赋予必要的使用权限，减少竞态风险：

const resultBuffer = device.createBuffer({
  size: BUFFER_SIZE,
  usage: GPUBufferUsage.STORAGE | GPUBufferUsage.COPY_SRC,
  mappedAtCreation: true
});

3. Shader内添加内存屏障 #

即使单线程写入，内存屏障也能确保内存操作的原子性，防止重复执行带来的异常写入：

@compute @workgroup_size(64)
fn main(@builtin(global_invocation_id) id: vec3<u32>) {
  if (id.x == 0u) {
    memoryBarrier(MemoryBarrierFlags.STORAGE);
    resultBuffer[0] = 1u;
  }
  any_compute();
}

4. 排查任务提交逻辑 #

检查代码中是否存在循环、异步回调导致的计算任务重复提交，确保每次测试仅提交一次计算命令。

验证方式 #

修改后重复运行测试，确认控制台输出稳定为{1: 1000}；若问题仍存在，可通过Chrome DevTools的WebGPU面板查看命令队列执行日志，排查是否存在任务重复调度或内存访问异常。

内容的提问来源于stack exchange，提问作者czfaero