Что нового в WebGPU (Chrome 131)

Франсуа Бофор
François Beaufort

Расстояния клипов в WGSL

Расстояния отсечения позволяют вам ограничивать объем отсечения примитивов с помощью определяемых пользователем полупространств на выходе этапа вершин. Определение собственных плоскостей отсечения дает больший контроль над тем, что видно в сценах WebGPU. Этот метод особенно полезен для таких приложений, как программное обеспечение CAD, где точный контроль над визуализацией имеет решающее значение.

Когда функция "clip-distances" доступна в GPUAdapter, запросите GPUDevice с этой функцией, чтобы получить поддержку расстояний отсечения в WGSL, и явно включите это расширение в коде WGSL с помощью enable clip_distances; . После включения вы можете использовать встроенный массив clip_distances в вершинном шейдере. Этот массив содержит расстояния до определяемой пользователем плоскости отсечения:

  • Расстояние отсечения, равное 0, означает, что вершина лежит на плоскости.
  • Положительное расстояние означает, что вершина находится внутри полупространства обрезки (стороны, которую вы хотите сохранить).
  • Отрицательное расстояние означает, что вершина находится за пределами полупространства обрезки (стороны, которую вы хотите отбросить).

См. следующий фрагмент, запись chromestatus и проблему 358408571 .

const adapter = await navigator.gpu.requestAdapter();
if (!adapter.features.has("clip-distances")) {
  throw new Error("Clip distances support is not available");
}
// Explicitly request clip distances support.
const device = await adapter.requestDevice({
  requiredFeatures: ["clip-distances"],
});

const vertexShaderModule = device.createShaderModule({ code: `
  enable clip_distances;

  struct VertexOut {
    @builtin(clip_distances) my_clip_distances : array<f32, 1>,
    @builtin(position) my_position : vec4f,
  }
  @vertex fn main() -> VertexOut {
    var output : VertexOut;
    output.my_clip_distances[0] = 1;
    output.my_position = vec4f(0, 0, 0, 1);
    return output;
  }
`,
});

// Send the appropriate commands to the GPU...

GPUCanvasContext получитьКонфигурацию()

После вызова GPUCanvasContext configure() со словарем конфигурации метод GPUCanvasContext getConfiguration() позволяет проверить конфигурацию контекста холста. Он включает в себя элементы device , format , usage , viewFormats , colorSpace , toneMapping и alphaMode . Это полезно для таких задач, как проверка поддержки браузером HDR-холста, как показано в примере Particles (HDR) . См. следующий фрагмент, запись chromestatus и проблему 370109829 .

const adapter = await navigator.gpu.requestAdapter();
const device = await adapter.requestDevice();

const canvas = document.querySelector("canvas");
const context = canvas.getContext("webgpu");

// Configure the canvas for HDR.
context.configure({
  device,
  format: "rgba16float",
  toneMapping: { mode: "extended" },
});

const configuration = context.getConfiguration();
if (configuration.toneMapping.mode === "extended") {
  // The browser supports HDR canvas.
  // Warning! The user still needs a HDR display to enjoy HDR content.
}

Точечные и линейные примитивы не должны иметь смещения глубины.

Как было объявлено ранее , спецификация WebGPU теперь делает ошибкой проверки установку depthBias , depthBiasSlopeScale и depthBiasClamp в ненулевое значение, когда топология конвейера рендеринга является линейным или точечным типом. См. проблему 352567424 .

Встроенные функции сканирования для подгрупп

В рамках экспериментов с подгруппами в выпуске 361330160 были добавлены следующие встроенные функции подгрупп:

  • subgroupInclusiveAdd(value) : возвращает инклюзивную сумму сканирования всех активных вызовов value s в подгруппе.
  • subgroupInclusiveMul(value) : возвращает инклюзивное сканирование умножения всех активных вызовов value s в подгруппе.

Экспериментальная поддержка многоразового непрямого вывода

Функция multi-draw indirect GPU позволяет вам выполнять несколько вызовов отрисовки с помощью одной команды GPU. Это особенно полезно в ситуациях, когда необходимо отрисовать большое количество объектов, например, системы частиц, создание экземпляров и большие сцены. Методы drawIndirect() и drawIndexedIndirect() GPURenderPassEncoder могут выполнять только один вызов отрисовки за раз из определенной области буфера GPU.

Пока эта экспериментальная функция не стандартизирована , включите флаг «Поддержка небезопасного WebGPU» на chrome://flags/#enable-unsafe-webgpu чтобы сделать ее доступной в Chrome.

С нестандартной функцией GPU "chromium-experimental-multi-draw-indirect" доступной в GPUAdapter, запросите GPUDevice с этой функцией. Затем создайте GPUBuffer с использованием GPUBufferUsage.INDIRECT для хранения вызовов отрисовки. Вы можете использовать его позже в новых методах multiDrawIndirect() и multiDrawIndexedIndirect() GPURenderPassEncoder для выдачи вызовов отрисовки внутри прохода рендеринга. Смотрите следующий фрагмент и проблему 356461286 .

const adapter = await navigator.gpu.requestAdapter();
if (!adapter.features.has("chromium-experimental-multi-draw-indirect")) {
  throw new Error("Experimental multi-draw indirect support is not available");
}
// Explicitly request experimental multi-draw indirect support.
const device = await adapter.requestDevice({
  requiredFeatures: ["chromium-experimental-multi-draw-indirect"],
});

// Draw call have vertexCount, instanceCount, firstVertex, and firstInstance parameters.
const drawData = new Uint32Array([
  3, 1, 0, 0, // First draw call
  3, 1, 3, 0, // Second draw call
]);
// Create a buffer to store the draw calls.
const drawBuffer = device.createBuffer({
  size: drawData.byteLength,
  usage: GPUBufferUsage.INDIRECT | GPUBufferUsage.COPY_DST,
});
device.queue.writeBuffer(drawBuffer, 0, drawData);

// Create a render pipeline, a vertex buffer, and a render pass encoder...

// Inside a render pass, issue the draw calls.
myPassEncoder.setPipeline(myPipeline);
myPassEncoder.setVertexBuffer(0, myVertexBuffer);
myPassEncoder.multiDrawIndirect(drawBuffer, /*offset=*/ 0, /*maxDrawCount=*/ 2);
myPassEncoder.end();

Опция компиляции шейдерного модуля строгая математика

В GPUShaderModuleDescriptor добавлена ​​опция разработчика boolean strictMath , позволяющая включать или отключать строгую математику во время компиляции модуля шейдера. Она доступна за флагом "WebGPU Developer Features" по адресу chrome://flags/#enable-webgpu-developer-features , что означает, что эта функция предназначена только для использования во время разработки. См. issue 42241455 .

Эта опция в настоящее время поддерживается в Metal и Direct3D. Когда строгая математика отключена, компилятор может оптимизировать ваши шейдеры следующим образом:

  • Игнорирование возможности значений NaN и Infinity.
  • Рассматриваем -0 как +0.
  • Замена деления более быстрым умножением на обратную величину.
  • Операции перестановки, основанные на ассоциативных и распределительных свойствах.
const adapter = await navigator.gpu.requestAdapter();
const device = await adapter.requestDevice();

const code = `
  // Examines the bit pattern of the floating-point number to
  // determine if it represents a NaN according to the IEEE 754 standard.
  fn isNan(x : f32) -> bool {
    bool ones_exp = (bitcast<u32>(x) & 0x7f8) == 0x7f8;
    bool non_zero_sig = (bitcast<u32>(x) & 0x7ffff) != 0;
    return ones_exp && non_zero_sig;
  }
  // ...
`;

// Enable strict math during shader compilation.
const shaderModule = device.createShaderModule({ code, strictMath: true });

Удалить GPUAdapter requestAdapterInfo()

Асинхронный метод GPUAdapter requestAdapterInfo() избыточен, поскольку вы уже можете получить GPUAdapterInfo синхронно с помощью атрибута GPUAdapter info . Следовательно, нестандартный метод GPUAdapter requestAdapterInfo() теперь удален. См. намерение удалить .

Обновления рассвета

Исполняемый файл tint_benchmark измеряет стоимость перевода шейдеров из WGSL на каждый язык бэкенда. Ознакомьтесь с новой документацией , чтобы узнать больше об этом.

Это охватывает только некоторые из ключевых моментов. Ознакомьтесь с исчерпывающим списком коммитов .

Что нового в WebGPU

Список всего, что было рассмотрено в серии « Что нового в WebGPU» .

Хром 137

Хром 136

Хром 135

Хром 134

Хром 133

Хром 132

Хром 131

Хром 130

Хром 129

Хром 128

Хром 127

Хром 126

Хром 125

Хром 124

Хром 123

Хром 122

Хром 121

Хром 120

Хром 119

Хром 118

Хром 117

Хром 116

Хром 115

Хром 114

Хром 113

,

Франсуа Бофор
François Beaufort

Расстояния клипов в WGSL

Расстояния отсечения позволяют вам ограничивать объем отсечения примитивов с помощью определяемых пользователем полупространств на выходе этапа вершин. Определение собственных плоскостей отсечения дает больший контроль над тем, что видно в сценах WebGPU. Этот метод особенно полезен для таких приложений, как программное обеспечение CAD, где точный контроль над визуализацией имеет решающее значение.

Когда функция "clip-distances" доступна в GPUAdapter, запросите GPUDevice с этой функцией, чтобы получить поддержку расстояний отсечения в WGSL, и явно включите это расширение в коде WGSL с помощью enable clip_distances; . После включения вы можете использовать встроенный массив clip_distances в вершинном шейдере. Этот массив содержит расстояния до определяемой пользователем плоскости отсечения:

  • Расстояние отсечения, равное 0, означает, что вершина лежит на плоскости.
  • Положительное расстояние означает, что вершина находится внутри полупространства обрезки (стороны, которую вы хотите сохранить).
  • Отрицательное расстояние означает, что вершина находится за пределами полупространства обрезки (стороны, которую вы хотите отбросить).

См. следующий фрагмент, запись chromestatus и проблему 358408571 .

const adapter = await navigator.gpu.requestAdapter();
if (!adapter.features.has("clip-distances")) {
  throw new Error("Clip distances support is not available");
}
// Explicitly request clip distances support.
const device = await adapter.requestDevice({
  requiredFeatures: ["clip-distances"],
});

const vertexShaderModule = device.createShaderModule({ code: `
  enable clip_distances;

  struct VertexOut {
    @builtin(clip_distances) my_clip_distances : array<f32, 1>,
    @builtin(position) my_position : vec4f,
  }
  @vertex fn main() -> VertexOut {
    var output : VertexOut;
    output.my_clip_distances[0] = 1;
    output.my_position = vec4f(0, 0, 0, 1);
    return output;
  }
`,
});

// Send the appropriate commands to the GPU...

GPUCanvasContext получитьКонфигурацию()

После вызова GPUCanvasContext configure() со словарем конфигурации метод GPUCanvasContext getConfiguration() позволяет проверить конфигурацию контекста холста. Он включает в себя элементы device , format , usage , viewFormats , colorSpace , toneMapping и alphaMode . Это полезно для таких задач, как проверка поддержки браузером HDR-холста, как показано в примере Particles (HDR) . См. следующий фрагмент, запись chromestatus и проблему 370109829 .

const adapter = await navigator.gpu.requestAdapter();
const device = await adapter.requestDevice();

const canvas = document.querySelector("canvas");
const context = canvas.getContext("webgpu");

// Configure the canvas for HDR.
context.configure({
  device,
  format: "rgba16float",
  toneMapping: { mode: "extended" },
});

const configuration = context.getConfiguration();
if (configuration.toneMapping.mode === "extended") {
  // The browser supports HDR canvas.
  // Warning! The user still needs a HDR display to enjoy HDR content.
}

Точечные и линейные примитивы не должны иметь смещения глубины.

Как было объявлено ранее , спецификация WebGPU теперь делает ошибкой проверки установку depthBias , depthBiasSlopeScale и depthBiasClamp в ненулевое значение, когда топология конвейера рендеринга является линейным или точечным типом. См. проблему 352567424 .

Встроенные функции сканирования для подгрупп

В рамках экспериментов с подгруппами в выпуске 361330160 были добавлены следующие встроенные функции подгрупп:

  • subgroupInclusiveAdd(value) : возвращает инклюзивную сумму сканирования всех активных вызовов value s в подгруппе.
  • subgroupInclusiveMul(value) : возвращает инклюзивное сканирование умножения всех активных вызовов value s в подгруппе.

Экспериментальная поддержка многоразового непрямого вывода

Функция multi-draw indirect GPU позволяет вам выполнять несколько вызовов отрисовки с помощью одной команды GPU. Это особенно полезно в ситуациях, когда необходимо отрисовать большое количество объектов, например, системы частиц, создание экземпляров и большие сцены. Методы drawIndirect() и drawIndexedIndirect() GPURenderPassEncoder могут выполнять только один вызов отрисовки за раз из определенной области буфера GPU.

Пока эта экспериментальная функция не стандартизирована , включите флаг «Поддержка небезопасного WebGPU» на chrome://flags/#enable-unsafe-webgpu чтобы сделать ее доступной в Chrome.

С нестандартной функцией GPU "chromium-experimental-multi-draw-indirect" доступной в GPUAdapter, запросите GPUDevice с этой функцией. Затем создайте GPUBuffer с использованием GPUBufferUsage.INDIRECT для хранения вызовов отрисовки. Вы можете использовать его позже в новых методах multiDrawIndirect() и multiDrawIndexedIndirect() GPURenderPassEncoder для выдачи вызовов отрисовки внутри прохода рендеринга. Смотрите следующий фрагмент и проблему 356461286 .

const adapter = await navigator.gpu.requestAdapter();
if (!adapter.features.has("chromium-experimental-multi-draw-indirect")) {
  throw new Error("Experimental multi-draw indirect support is not available");
}
// Explicitly request experimental multi-draw indirect support.
const device = await adapter.requestDevice({
  requiredFeatures: ["chromium-experimental-multi-draw-indirect"],
});

// Draw call have vertexCount, instanceCount, firstVertex, and firstInstance parameters.
const drawData = new Uint32Array([
  3, 1, 0, 0, // First draw call
  3, 1, 3, 0, // Second draw call
]);
// Create a buffer to store the draw calls.
const drawBuffer = device.createBuffer({
  size: drawData.byteLength,
  usage: GPUBufferUsage.INDIRECT | GPUBufferUsage.COPY_DST,
});
device.queue.writeBuffer(drawBuffer, 0, drawData);

// Create a render pipeline, a vertex buffer, and a render pass encoder...

// Inside a render pass, issue the draw calls.
myPassEncoder.setPipeline(myPipeline);
myPassEncoder.setVertexBuffer(0, myVertexBuffer);
myPassEncoder.multiDrawIndirect(drawBuffer, /*offset=*/ 0, /*maxDrawCount=*/ 2);
myPassEncoder.end();

Опция компиляции шейдерного модуля строгая математика

В GPUShaderModuleDescriptor добавлена ​​опция разработчика boolean strictMath , позволяющая включать или отключать строгую математику во время компиляции модуля шейдера. Она доступна за флагом "WebGPU Developer Features" по адресу chrome://flags/#enable-webgpu-developer-features , что означает, что эта функция предназначена только для использования во время разработки. См. issue 42241455 .

Эта опция в настоящее время поддерживается в Metal и Direct3D. Когда строгая математика отключена, компилятор может оптимизировать ваши шейдеры следующим образом:

  • Игнорирование возможности значений NaN и Infinity.
  • Рассматриваем -0 как +0.
  • Замена деления более быстрым умножением на обратную величину.
  • Операции перестановки, основанные на ассоциативных и распределительных свойствах.
const adapter = await navigator.gpu.requestAdapter();
const device = await adapter.requestDevice();

const code = `
  // Examines the bit pattern of the floating-point number to
  // determine if it represents a NaN according to the IEEE 754 standard.
  fn isNan(x : f32) -> bool {
    bool ones_exp = (bitcast<u32>(x) & 0x7f8) == 0x7f8;
    bool non_zero_sig = (bitcast<u32>(x) & 0x7ffff) != 0;
    return ones_exp && non_zero_sig;
  }
  // ...
`;

// Enable strict math during shader compilation.
const shaderModule = device.createShaderModule({ code, strictMath: true });

Удалить GPUAdapter requestAdapterInfo()

Асинхронный метод GPUAdapter requestAdapterInfo() избыточен, поскольку вы уже можете получить GPUAdapterInfo синхронно с помощью атрибута GPUAdapter info . Следовательно, нестандартный метод GPUAdapter requestAdapterInfo() теперь удален. См. намерение удалить .

Обновления рассвета

Исполняемый файл tint_benchmark измеряет стоимость перевода шейдеров из WGSL на каждый язык бэкенда. Ознакомьтесь с новой документацией , чтобы узнать больше об этом.

Это охватывает только некоторые из ключевых моментов. Ознакомьтесь с исчерпывающим списком коммитов .

Что нового в WebGPU

Список всего, что было рассмотрено в серии « Что нового в WebGPU» .

Хром 137

Хром 136

Хром 135

Хром 134

Хром 133

Хром 132

Хром 131

Хром 130

Хром 129

Хром 128

Хром 127

Хром 126

Хром 125

Хром 124

Хром 123

Хром 122

Хром 121

Хром 120

Хром 119

Хром 118

Хром 117

Хром 116

Хром 115

Хром 114

Хром 113