Novedades de WebGPU (Chrome 137)

François Beaufort
François Beaufort

Fecha de publicación: 26 de mayo de 2025

Usa la vista de textura para la vinculación de externalTexture

Ahora se permite usar un GPUTextureView compatible (2D, un solo subrecurso) en lugar de una vinculación de GPUExternalTexture cuando se crea un GPUBindGroup.

Esto simplifica la lógica del sombreador en las canalizaciones de efectos de video en las que se deben controlar tanto GPUExternalTexture (para el video fuente) como GPUTextureView (para el procesamiento intermedio). También reduce la necesidad de compilar sombreadores de forma dinámica según la procedencia de la textura. Consulta Intent to Ship: WebGPU: GPUTextureView for externalTexture binding.

const texture = myDevice.createTexture({
  size: [42, 42],
  format: navigator.gpu.getPreferredCanvasFormat(),
  usage: GPUTextureUsage.RENDER_ATTACHMENT | GPUTextureUsage.TEXTURE_BINDING,
});

const code = `
@group(0) @binding(0) var texture : texture_external;
@group(0) @binding(1) var<storage, read_write> buffer: vec2u;
    
@compute @workgroup_size(1) fn main() {
  buffer = textureDimensions(texture);
}`;

const pipeline = myDevice.createComputePipeline({
  layout: "auto",
  compute: { module: myDevice.createShaderModule({ code }) },
});

const bindGroup = myDevice.createBindGroup({
  layout: pipeline.getBindGroupLayout(0),
  entries: [
    { binding: 0, resource: texture.createView() }, // Use texture view for an externalTexture binding
    { binding: 1, resource: { buffer: myBuffer } },
  ],
});

Los búferes se copian sin especificar desplazamientos ni tamaño

Una nueva sobrecarga del método GPUCommandEncoder permite que los desarrolladores omitan los parámetros de desplazamiento y tamaño cuando usan copyBufferToBuffer() para simplificar la copia de búferes completos. Consulta Intent to Ship: WebGPU: copyBufferToBuffer overload.

const size = 42;
const srcBuffer = myDevice.createBuffer({
  size,
  usage: GPUBufferUsage.STORAGE | GPUBufferUsage.COPY_SRC,
});
const dstBuffer = myDevice.createBuffer({
  size,
  usage: GPUBufferUsage.COPY_DST | GPUBufferUsage.MAP_READ,
});

// Copy entire buffer.
myCommandEncoder.copyBufferToBuffer(srcBuffer, dstBuffer);

// This is the same as the following.
// myCommandEncoder.copyBufferToBuffer(srcBuffer, 0, dstBuffer, 0, size);

WGSL workgroupUniformLoad que usa un puntero a un valor atómico

Se agregó una nueva sobrecarga de workgroupUniformLoad(ptr) en WGSL para mayor comodidad de los desarrolladores. Carga de forma atómica el valor al que apunta ptr y lo devuelve a todas las invocaciones del grupo de trabajo, donde ptr es un puntero a un valor atómico dentro de una variable del grupo de trabajo. Consulta el problema 408241039.

@group(0) @binding(0) var<storage, read_write> buffer : array<u32, 1>;

var<workgroup> wgvar : atomic<u32>;

@compute @workgroup_size(1, 1)
fn main(@builtin(local_invocation_index) lid: u32) {
  if (lid == 0) {
    atomicStore(&(wgvar), 42u);
  }
  buffer[lid] = workgroupUniformLoad(&wgvar);
}

Atributo powerPreference de GPUAdapterInfo

El atributo de cadena powerPreference no estándar de GPUAdapterInfo ahora está disponible cuando el usuario habilitó la marca "Funciones para desarrolladores de WebGPU" en chrome://flags/#enable-webgpu-developer-features. Si se admite, el valor de powerPreference puede ser "low-power" o "high-performance", según el valor de GPUPowerPreference que se usó en GPURequestAdapterOptions. Consulta CL 6438860.

function checkPowerPreferenceForGpuDevice(device) {
  const powerPreference = device.adapterInfo.powerPreference;
  if (powerPreference === "high-performance") {
    // High-performance GPU detected. Enabling enhanced graphics settings.
  } else if (powerPreference === "low-power") {
    // Low-power GPU detected. Optimizing for battery life.
  }
}

Se quitó el atributo compatibilityMode de GPURequestAdapterOptions

Se quitó el atributo experimental compatibilityMode de GPURequestAdapterOptions y se agregó el atributo estandarizado featureLevel en Chrome 133. Consulta el problema 366151404.

Actualizaciones de Dawn

Los desarrolladores pueden crear proyectos de WebGPU en lenguajes como C++, usando webgpu.h para segmentar tanto WebAssembly como plataformas específicas. La versión recién lanzada de Dawn, "emdawnwebgpu" ("Emscripten Dawn WebGPU"), implementa el archivo webgpu.h estandarizado más reciente a través de la API del navegador.

Emdawnwebgpu es una bifurcación (mantenida) de las vinculaciones integradas (USE_WEBGPU) de Emscripten (que ya no se mantienen). Todo el desarrollo nuevo se realiza en emdawnwebgpu, y las vinculaciones integradas de Emscripten se quitarán a medida que los desarrolladores realicen la transición a emdawnwebgpu. El encabezado en C de Emdawnwebgpu es muy similar al de Dawn, mientras que las vinculaciones integradas están significativamente desactualizadas.

Descarga emdawnwebgpu desde la página de versiones de Dawn en GitHub y lee el README.md del paquete para obtener información sobre cómo usarlo. Los archivos fuente se pueden encontrar en el repositorio de Dawn.

Para obtener una guía completa, consulta la documentación actualizada sobre cómo compilar una app con WebGPU.

Esto solo abarca algunos de los aspectos destacados clave. Consulta la lista exhaustiva de confirmaciones.

Novedades de WebGPU

Una lista de todo lo que se abordó en la serie Novedades de WebGPU

Chrome 140

Chrome 139

Chrome 138

Chrome 137

Chrome 136

Chrome 135

Chrome 134

Chrome 133

Chrome 132

Chrome 131

Chrome 130

Chrome 129

Chrome 128

Chrome 127

Chrome 126

Chrome 125

Chrome 124

Chrome 123

Chrome 122

Chrome 121

Chrome 120

Chrome 119

Chrome 118

Chrome 117

Chrome 116

Chrome 115

Chrome 114

Chrome 113