GPURenderBundleEncoder

Интерфейс GPURenderBundleEncoder API WebGPU используется для предварительной записи наборов команд.

Наборы команд кодируются с помощью методов GPURenderBundleEncoder; после кодирования необходимых команд они записываются в экземпляр объекта GPURenderBundle с использованием метода GPURenderBundleEncoder.finish(). Эти наборы рендеринга можно повторно использовать в нескольких проходах рендеринга, передавая объекты GPURenderBundle в вызовы GPURenderPassEncoder.executeBundles().

По сути, это как частичный проход рендеринга — GPURenderBundleEncoder имеют все те же функции, что и GPURenderPassEncoder, за исключением того, что они не могут начать и завершить запросы окклюзии, а также не могут установить scissor rect, viewport, blend constant и stencil reference. GPURenderBundle унаследует все эти значения от GPURenderPassEncoder, который его выполняет.

Повторное использование предварительно записанных команд может значительно повысить производительность приложения в ситуациях, когда издержки вызова рисования JavaScript являются узким местом. Наборы рендеринга наиболее эффективны в ситуациях, когда набор объектов рисуется одинаково в нескольких представлениях или кадрах, единственным отличием является содержимое используемого буфера (например, обновленные униформированные матрицы). Хорошим примером является рендеринг VR. Запись рендеринга в виде набора рендеринга и последующая настройка матрицы вида и его воспроизведение для каждого глаза — более эффективный способ выдачи вызовов рисования для обоих рендерингов сцены.

Экземпляр объекта GPURenderBundleEncoder создаётся через свойство GPUDevice.createRenderBundleEncoder().

label Экспериментально

Строка, предоставляющая метку, которая может быть использована для идентификации объекта, например, в сообщениях GPUError или предупреждениях консоли.

draw() Экспериментально

Отрисовка примитивов на основе вершинных буферов, предоставленных setVertexBuffer().

drawIndexed() Экспериментально

Отрисовка индексированных примитивов на основе вершинных и индексных буферов, предоставленных setVertexBuffer() и setIndexBuffer().

drawIndirect() Экспериментально

Отрисовка примитивов с параметрами, считанными из GPUBuffer.

drawIndexedIndirect() Экспериментально

Отрисовка индексированных примитивов с параметрами, считанными из GPUBuffer.

finish() Экспериментально

Завершает запись текущей последовательности команд прохода рендеринга.

insertDebugMarker() Экспериментально

Помечает определённую точку в серии закодированных команд меткой.

popDebugGroup() Экспериментально

Завершает группу отладки, начатую вызовом pushDebugGroup().

pushDebugGroup() Экспериментально

Начинает группу отладки, которая помечается заданной меткой и будет содержать все последующие закодированные команды до вызова метода popDebugGroup().

setBindGroup() Экспериментально

Устанавливает GPUBindGroup для использования в последующих командах набора рендеринга для заданного индекса.

setIndexBuffer() Экспериментально

Устанавливает текущий GPUBuffer, который будет предоставлять индексные данные для последующих команд отрисовки.

setPipeline() Экспериментально

Устанавливает GPURenderPipeline для использования в этом наборе рендеринга.

setVertexBuffer() Экспериментально

Устанавливает или сбрасывает текущий GPUBuffer, который будет предоставлять вершинные данные для последующих команд отрисовки.

В примере Animometer в WebGPU Samples выполняется множество подобных операций для многих различных объектов одновременно. Набор команд кодируется с помощью следующей функции:

function recordRenderPass(
  passEncoder: GPURenderBundleEncoder | GPURenderPassEncoder
) {
  if (settings.dynamicOffsets) {
    passEncoder.setPipeline(dynamicPipeline);
  } else {
    passEncoder.setPipeline(pipeline);
  }
  passEncoder.setVertexBuffer(0, vertexBuffer);
  passEncoder.setBindGroup(0, timeBindGroup);
  const dynamicOffsets = [0];
  for (let i = 0; i < numTriangles; ++i) {
    if (settings.dynamicOffsets) {
      dynamicOffsets[0] = i * alignedUniformBytes;
      passEncoder.setBindGroup(1, dynamicBindGroup, dynamicOffsets);
    } else {
      passEncoder.setBindGroup(1, bindGroups[i]);
    }
    passEncoder.draw(3, 1, 0, 0);
  }
}

Позже создаётся GPURenderBundleEncoder, вызывается функция, и набор команд записывается в GPURenderBundle с помощью GPURenderBundleEncoder.finish():

const renderBundleEncoder = device.createRenderBundleEncoder({
  colorFormats: [presentationFormat],
});
recordRenderPass(renderBundleEncoder);
const renderBundle = renderBundleEncoder.finish();

GPURenderPassEncoder.executeBundles() затем используется для повторного использования работы в нескольких проходах рендеринга для повышения производительности. Изучите пример кода для полного контекста.

// ...

return function doDraw(timestamp) {
  if (startTime === undefined) {
    startTime = timestamp;
  }
  uniformTime[0] = (timestamp - startTime) / 1000;
  device.queue.writeBuffer(uniformBuffer, timeOffset, uniformTime.buffer);

  renderPassDescriptor.colorAttachments[0].view = context
    .getCurrentTexture()
    .createView();

  const commandEncoder = device.createCommandEncoder();
  const passEncoder = commandEncoder.beginRenderPass(renderPassDescriptor);

  if (settings.renderBundles) {
    passEncoder.executeBundles([renderBundle]);
  } else {
    recordRenderPass(passEncoder);
  }

  passEncoder.end();
  device.queue.submit([commandEncoder.finish()]);
};

// ...

• API WebGPU