GPUCommandEncoder: beginRenderPass() Methode
Eingeschränkt verfügbar
Diese Funktion ist nicht Baseline, da sie in einigen der am weitesten verbreiteten Browser nicht funktioniert.
Want more browser support for this feature? Tell us why.
Sicherer Kontext: Diese Funktion ist nur in sicheren Kontexten (HTTPS) in einigen oder allen unterstützenden Browsern verfügbar.
Hinweis: Diese Funktion ist in Web Workers verfügbar.
Die beginRenderPass() Methode der GPUCommandEncoder-Schnittstelle startet die Kodierung eines Render-Passes und gibt einen GPURenderPassEncoder zurück, der zur Steuerung des Renderings verwendet werden kann.
Syntax
beginRenderPass(descriptor)
Parameter
descriptor-
Ein Objekt, das die folgenden Eigenschaften enthält:
colorAttachments-
Ein Array von Objekten (siehe Struktur des Farbattachment-Objekts), die die Farbattachments definieren, die bei der Ausführung dieses Render-Passes ausgegeben werden.
depthStencilAttachmentOptional-
Ein Objekt (siehe Struktur des Tiefen-/Stencilattachment-Objekts), das das Tiefen-/Stencilattachment definiert, das bei der Ausführung dieses Render-Passes ausgegeben und getestet wird.
labelOptional-
Eine Zeichenkette, die ein Etikett bereitstellt, das zur Identifizierung des Objekts verwendet werden kann, beispielsweise in
GPUError-Nachrichten oder Konsolenwarnungen. maxDrawCountOptional-
Eine Zahl, die die maximale Anzahl von Zeichenvorgängen angibt, die im Render-Pass durchgeführt werden. Dies wird von einigen Implementierungen verwendet, um die vor dem Render-Pass injizierte Arbeit zu dimensionieren. Sie sollten den Standardwert — 50000000 — beibehalten, es sei denn, Sie wissen, dass mehr Zeichenvorgänge durchgeführt werden.
occlusionQuerySetOptional-
Das
GPUQuerySet, das die Occlusion-Query-Ergebnisse für diesen Durchgang speichert. timestampWritesOptional-
Ein Array von Objekten, das definiert, wo und wann Zeitstempel-Query-Werte für diesen Durchgang geschrieben werden. Diese Objekte haben die folgenden Eigenschaften:
querySet-
Ein
GPUQuerySetvom Typ"timestamp", zu dem die Zeitstempelquery-Ergebnisse geschrieben werden. beginningOfPassWriteIndex-
Eine Zahl, die den Query-Index in
querySetangibt, an dem der Zeitstempel zu Beginn des Render-Passes geschrieben wird. Diese Angabe ist optional – wenn sie nicht definiert ist, wird kein Zeitstempel für den Beginn des Durchgangs geschrieben. endOfPassWriteIndex-
Eine Zahl, die den Query-Index in
querySetangibt, an dem der Zeitstempel am Ende des Render-Passes geschrieben wird. Diese Angabe ist optional – wenn sie nicht definiert ist, wird kein Zeitstempel für das Ende des Durchgangs geschrieben.
Hinweis: Das
timestamp-queryFeature muss aktiviert werden, um Zeitstempelqueries zu verwenden. Zeitstempelquery-Werte werden in Nanosekunden geschrieben, aber wie der Wert bestimmt wird, ist implementierungsabhängig.
Struktur des Farbattachment-Objekts
Farbattachment-Objekte können die folgenden Eigenschaften haben:
clearValueOptional-
Ein Farbwert, um die
view-Textur vor der Ausführung des Render-Passes zu löschen. Dieser Wert wird ignoriert, wennloadOpnicht auf"clear"gesetzt ist.clearValuekann ein Array oder ein Objekt sein, das die vier Farbkomponentenr,g,bundaals Dezimalzahlen darstellt.Zum Beispiel können Sie ein Array wie
[0.0, 0.5, 1.0, 1.0]oder ihr entsprechendes Objekt{ r: 0.0, g: 0.5, b: 1.0, a: 1.0 }übergeben.Wenn
clearValueweggelassen wird, ist der Standardwert{ r: 0, g: 0, b: 0, a: 0 }. depthSliceOptional-
Eine Zahl, die den Index des 3D-Tiefenslice angibt, zu dem für dieses Farbattachment in der Fall eines 3D-
GPUTextureView-viewausgegeben wird. Wenn angegeben, ermöglicht dies WebGPU, direkt zu Slices von 3D-Texturen innerhalb von Render-Pässen zu rendern. loadOp-
Ein enumerierter Wert, der die Ladevorgänge angibt, die vor der Ausführung des Render-Passes an
viewdurchgeführt werden. Mögliche Werte sind:"clear": Lädt denclearValuefür dieses Attachment in den Render-Pass."load": Lädt den vorhandenen Wert für dieses Attachment in den Render-Pass.
Hinweis: Es wird empfohlen, immer
"clear"zu verwenden, wenn der Anfangswert keine Rolle spielt, da dies auf einigen Geräten wie Mobilgeräten eine bessere Leistung bietet. storeOp-
Ein enumerierter Wert, der den Speichervorgang angibt, der nach der Ausführung des Render-Passes an
viewdurchgeführt wird. Mögliche Werte sind:"discard": Verwirft den resultierenden Wert des Render-Passes für dieses Attachment."store": Speichert den resultierenden Wert des Render-Passes für dieses Attachment.
resolveTargetOptional-
Ein Objekt, das die Texturunterressource darstellt, die die aufgelöste Ausgabe für dieses Farbattachment erhält, wenn
viewmultisampled ist. Dies kann eines der folgenden sein:GPUTextureViewGPUTexture: Kann anstelle einerGPUTextureViewverwendet werden, sofern ein Standardview gewünscht ist. Wenn in diesem Kontext verwendet, istGPUTexturegleichwertig mit einemGPUTextureView-Objekt, das mit einem unerhindertenGPUTexture.createView()Aufruf erstellt wurde.
view-
Ein Objekt, das die Texturunterressource darstellt, die für dieses Farbattachment ausgegeben wird. Dies kann eines der folgenden sein:
GPUTextureViewGPUTexture: Kann anstelle einerGPUTextureViewverwendet werden, sofern ein Standardview gewünscht ist. Wenn in diesem Kontext verwendet, istGPUTexturegleichwertig mit einemGPUTextureView-Objekt, das mit einem unerhindertenGPUTexture.createView()Aufruf erstellt wurde.
Hinweis: Jedes Farb- oder Tiefen-/Stencil-Attachment muss eine eindeutige Texturunterressource sein, und Texturunterressourcen, die als Attachments verwendet werden, können nicht innerhalb des Render-Passes verwendet werden.
Struktur des Tiefen-/Stencilattachment-Objekts
Das depthStencilAttachment-Objekt kann die folgenden Eigenschaften haben:
depthClearValueOptional-
Eine Zahl, die den Wert angibt, der vor der Ausführung des Render-Passes in die Tiefenkomponente des
viewgelöscht werden soll. Dieser Wert wird ignoriert, wenndepthLoadOpnicht auf"clear"gesetzt ist.Der Wert muss zwischen 0,0 und 1,0 liegen, einschließlich.
depthLoadOpOptional-
Ein enumerierter Wert, der den Ladevorgang angibt, der vor der Ausführung des Render-Passes an der Tiefenkomponente von
viewdurchgeführt wird. Mögliche Werte sind:"clear": Lädt denclearValuefür dieses Attachment in den Render-Pass."load": Lädt den vorhandenen Wert für dieses Attachment in den Render-Pass.
Hinweis: Es wird empfohlen, immer
"clear"zu verwenden, wenn der Anfangswert keine Rolle spielt, da dies auf einigen Geräten wie Mobilgeräten eine bessere Leistung bietet. depthReadOnlyOptional-
Ein boolean. Die Einstellung des Werts auf
trueführt dazu, dass die Tiefenkomponente vonviewnur lesbar ist. WenndepthReadOnlyweggelassen wird, ist der Standardwertfalse. depthStoreOpOptional-
Ein enumerierter Wert, der den Speichervorgang angibt, der nach der Ausführung des Render-Passes an der Tiefenkomponente von
viewdurchgeführt wird. Mögliche Werte sind:"discard": Verwirft den resultierenden Wert des Render-Passes für dieses Attachment."store": Speichert den resultierenden Wert des Render-Passes für dieses Attachment.
stencilClearValueOptional-
Eine Zahl, die den Wert angibt, der vor der Ausführung des Render-Passes in die Stencilkomponente von
viewgelöscht werden soll. Dieser Wert wird ignoriert, wennstencilLoadOpnicht auf"clear"gesetzt ist.Wenn
stencilClearValueweggelassen wird, ist der Standardwert 0. stencilLoadOpOptional-
Ein enumerierter Wert, der den Ladevorgang angibt, der vor der Ausführung des Render-Passes an der Stencilkomponente von
viewdurchgeführt wird. Mögliche Werte sind:"clear": Lädt denclearValuefür dieses Attachment in den Render-Pass."load": Lädt den vorhandenen Wert für dieses Attachment in den Render-Pass.
Hinweis: Es wird empfohlen, immer
"clear"zu verwenden, wenn der Anfangswert keine Rolle spielt, da dies auf einigen Geräten wie Mobilgeräten eine bessere Leistung bietet. stencilReadOnlyOptional-
Ein boolean. Die Einstellung des Werts auf
trueführt dazu, dass die Stencilkomponente vonviewnur lesbar ist. WennstencilReadOnlyweggelassen wird, ist der Standardwertfalse. stencilStoreOpOptional-
Ein enumerierter Wert, der den Speichervorgang angibt, der nach der Ausführung des Render-Passes an der Stencilkomponente von
viewdurchgeführt wird. Mögliche Werte sind:"discard": Verwirft den resultierenden Wert des Render-Passes für dieses Attachment."store": Speichert den resultierenden Wert des Render-Passes für dieses Attachment.
view-
Ein Objekt, das die Texturunterressource darstellt, die für dieses Tiefen-/Stencilattachment ausgegeben und gelesen wird. Dies kann eines der folgenden sein:
GPUTextureViewGPUTexture: Kann anstelle einerGPUTextureViewverwendet werden, sofern ein Standardview gewünscht ist. Wenn in diesem Kontext verwendet, istGPUTexturegleichwertig mit einemGPUTextureView-Objekt, das mit einem unerhindertenGPUTexture.createView()Aufruf erstellt wurde.
Rückgabewert
Ein GPURenderPassEncoder-Objektinstanz.
Validierung
Die folgenden Kriterien müssen bei der Aufruf von beginRenderPass() erfüllt sein, andernfalls wird ein GPUValidationError generiert und ein ungültiger GPURenderPassEncoder wird zurückgegeben.
Allgemein:
colorAttachments.lengthist kleiner oder gleich demmaxColorAttachmentsLimit desGPUDevice.- Wenn
colorAttachmentsnurnull-Werte enthält, wirddepthStencilAttachmentbereitgestellt. - Alle
views incolorAttachmentsunddepthStencilAttachmenthaben gleicheGPUTexture.sampleCount-Werte und Rendergrößen (GPUTexture.height,GPUTexture.widthundGPUTexture.depthOrArrayLayers). - Wenn
occlusionQuerySetgesetzt ist, hat das referenzierteGPUQuerySeteinentypevon"occlusion".
Für Farbattachment-Objekte:
- Die
viewist renderbar, und das Format derview(d.h. im Deskriptor des ursprünglichenGPUTexture.createView()Aufrufs angegeben) ist ein farbrenderbares Format. - Wenn
resolveTargetbereitgestellt wird:- Die
view's ursprünglicheGPUTexture'ssampleCountist größer als 1. - Die
resolveTarget's ursprünglicheGPUTexture'ssampleCountist 1. resolveTargetist renderbar.- Die Größen der Unterressourcen, die
viewundresolveTargetbereitstellen, stimmen überein. - Die Formate von
viewundresolveTargetstimmen überein.
- Die
- Color attachments bytes per sample sind kleiner oder gleich dem
maxColorAttachmentBytesPerSampleLimit desGPUDevice. - Wenn der
usagederGPUTexture.createView()-Operation, die die zugehörige Ansicht erstellt hat, dasTRANSIENT_ATTACHMENT-Bit enthält:loadOpist"clear".storeOpist"discard".
Für Tiefen-/Stencilattachment-Objekte:
- Die
viewist renderbar, und ihr Format ist ein depth-or-stencil-Format. - Wenn
depthLoadOpauf"clear"gesetzt ist, wird ein gültigerdepthClearValuebereitgestellt. - Wenn das Format von
viewein kombiniertes Tiefen- oder Stencilformat ist, entsprichtdepthReadOnlydemstencilReadOnly. - Wenn das Format von
vieweinen Tiefenaspekt hat unddepthReadOnlyfalseist, werdendepthLoadOpunddepthStoreOpbereitgestellt. - Wenn das Format von
vieweinen Tiefenaspekt hat unddepthReadOnlytrueist, werdendepthLoadOpunddepthStoreOpnicht bereitgestellt. - Wenn das Format von
vieweinen Stencilaspekt hat undstencilReadOnlyfalseist, werdenstencilLoadOpundstencilStoreOpbereitgestellt. - Wenn das Format von
vieweinen Stencilaspekt hat undstencilReadOnlytrueist, werdenstencilLoadOpundstencilStoreOpnicht bereitgestellt. - Wenn der
usagederGPUTexture.createView()-Operation, die die zugehörige Ansicht erstellt hat, dasTRANSIENT_ATTACHMENT-Bit enthält:- Wenn das Format von
vieweinen Tiefenaspekt hat:depthLoadOpist"clear".depthStoreOpist"discard".
- Wenn das Format von
vieweinen Stencilaspekt hat:stencilLoadOpist"clear".stencilStoreOpist"discard".
- Wenn das Format von
Für Zeitstempel-Queries:
Beispiele
In unserem grundlegenden Render-Demo werden eine Anzahl von Befehlen über einen GPUCommandEncoder aufgezeichnet. Diese Befehle stammen von dem GPURenderPassEncoder, das über beginRenderPass() erstellt wurde:
// …
// Create GPUCommandEncoder
const commandEncoder = device.createCommandEncoder();
// Create GPURenderPassDescriptor to tell WebGPU which texture to draw into, then initiate render pass
const renderPassDescriptor = {
colorAttachments: [
{
clearValue: clearColor,
loadOp: "clear",
storeOp: "store",
view: context.getCurrentTexture().createView(),
},
],
};
const passEncoder = commandEncoder.beginRenderPass(renderPassDescriptor);
// Draw a triangle
passEncoder.setPipeline(renderPipeline);
passEncoder.setVertexBuffer(0, vertexBuffer);
passEncoder.draw(3);
// End the render pass
passEncoder.end();
device.queue.submit([commandEncoder.finish()]);
// …
Spezifikationen
| Spezifikation |
|---|
| WebGPU> # dom-gpucommandencoder-beginrenderpass> |
Browser-Kompatibilität
Siehe auch
- Die WebGPU API