GPUDevice: createRenderBundleEncoder() Methode

descriptor

Ein Objekt, das die folgenden Eigenschaften enthält:

colorFormats

Ein Array von aufgezählten Werten, das die erwarteten Farbformate für Renderziele angibt. Für mögliche Werte siehe die GPUTextureFormat Definition in der Spezifikation.

depthReadOnly Optional

Ein boolescher Wert. Falls true, wird angegeben, dass das Ausführen eines durch den GPURenderBundleEncoder erstellten GPURenderBundle nicht die Tiefenkomponente des depthStencilFormat beim Ausführen verändert. Falls weggelassen, ist depthReadOnly standardmäßig false.

depthStencilFormat Optional

Ein aufgezählter Wert, der das erwartete Tiefen- oder Schablonenformat für Renderziele angibt. Für mögliche Werte siehe den Abschnitt Depth-stencil formats der Spezifikation.

label Optional

Eine Zeichenkette, die ein Label bereitstellt, das zur Identifizierung des Objekts verwendet werden kann, zum Beispiel in GPUError Meldungen oder Konsolenwarnungen.

sampleCount Optional

Eine Zahl, die die erwartete Abtastanzahl für Renderziele repräsentiert.

stencilReadOnly Optional

Ein boolescher Wert. Falls true, wird angegeben, dass das Ausführen eines durch den GPURenderBundleEncoder erstellten GPURenderBundle nicht die Schablonenkomponente des depthStencilFormat beim Ausführen verändert. Falls weggelassen, ist stencilReadOnly standardmäßig false.

Ein GPURenderBundleEncoder Objektinstanz.

Im WebGPU Samples Animometer Beispiel werden zahlreiche ähnliche Operationen gleichzeitig auf vielen verschiedenen Objekten durchgeführt. Ein Befehlssatz wird mit der folgenden Funktion kodiert:

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);
  }
}

Später wird ein GPURenderBundleEncoder mit createRenderBundleEncoder() erstellt, die Funktion aufgerufen, und der Befehlssatz in ein GPURenderBundle mit GPURenderBundleEncoder.finish() aufgezeichnet:

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

GPURenderPassEncoder.executeBundles() wird dann verwendet, um die Arbeit über mehrere Renderdurchläufe hinweg wiederzuverwenden und die Leistung zu verbessern. Studieren Sie das Beispiel-Code-Listing für den vollständigen Kontext.

// …

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()]);
};

// …

• Die WebGPU API