GPUDevice: Methode createRenderBundleEncoder()

Limited availability

This feature is not Baseline because it does not work in some of the most widely-used browsers.

Experimentell: Dies ist eine experimentelle Technologie
Überprüfen Sie die Browser-Kompatibilitätstabelle sorgfältig, bevor Sie diese produktiv verwenden.

Sicherer Kontext: Diese Funktion ist nur in sicheren Kontexten (HTTPS) in einigen oder allen unterstützenden Browsern verfügbar.

Hinweis: Dieses Feature ist verfügbar in Web Workers.

Die createRenderBundleEncoder()-Methode der GPUDevice-Schnittstelle erstellt einen GPURenderBundleEncoder, der verwendet werden kann, um Bündel von Befehlen vorab aufzuzeichnen. Diese können in GPURenderPassEncoders über die executeBundles()-Methode beliebig oft wiederverwendet werden.

Syntax

js
createRenderBundleEncoder(descriptor)

Parameter

descriptor

Ein Objekt mit den folgenden Eigenschaften:

colorFormats

Ein Array von enumerierten Werten, die die erwarteten Farbformate für Render-Ziele angeben. Mögliche Werte finden Sie in der GPUTextureFormat-Definition in der Spezifikation.

depthReadOnly Optional

Ein Boolean. Wenn true, bedeutet dies, dass das Ausführen eines vom GPURenderBundleEncoder erstellten GPURenderBundle die Tiefenkomponente des depthStencilFormat bei der Ausführung nicht modifizieren wird. Wenn weggelassen, wird depthReadOnly standardmäßig auf false gesetzt.

depthStencilFormat Optional

Ein enumerierter Wert, der das erwartete Format für Tiefe- oder Stencil-Ziele angibt. Mögliche Werte finden Sie im Abschnitt Depth-stencil formats der Spezifikation.

label Optional

Ein String, der eine Bezeichnung bereitstellt, die verwendet werden kann, um das Objekt zu identifizieren, z.B. in GPUError-Meldungen oder Konsolenwarnungen.

sampleCount Optional

Eine Zahl, die die erwartete Anzahl von Samples für Render-Ziele darstellt.

stencilReadOnly Optional

Ein Boolean. Wenn true, bedeutet dies, dass das Ausführen eines vom GPURenderBundleEncoder erstellten GPURenderBundle die Stencil-Komponente des depthStencilFormat bei der Ausführung nicht modifizieren wird. Wenn weggelassen, wird stencilReadOnly standardmäßig auf false gesetzt.

Rückgabewert

Eine GPURenderBundleEncoder-Objektinstanz.

Beispiele

Im WebGPU-Samples Animometer-Beispiel werden zahlreiche ähnliche Operationen an vielen verschiedenen Objekten gleichzeitig durchgeführt. Ein Bündel von Befehlen wird mit der folgenden Funktion kodiert:

js
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 wird aufgerufen, und das Befehlsbündel wird in einem GPURenderBundle mit GPURenderBundleEncoder.finish() aufgenommen:

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

Anschließend wird GPURenderPassEncoder.executeBundles() verwendet, um die Arbeit über mehrere Render-Durchläufe hinweg zu wiederholen und die Leistung zu verbessern. Studieren Sie das Beispiel zur vollständigen Kontextualisierung.

js
// ...

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

// ...

Spezifikationen

Specification
WebGPU
# dom-gpudevice-createrenderbundleencoder

Browser-Kompatibilität

BCD tables only load in the browser

Siehe auch