GPUDevice: Methode createRenderPipelineAsync()
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 vor der Verwendung auf produktiven Webseiten.
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 createRenderPipelineAsync()
-Methode der GPUDevice
-Schnittstelle gibt ein Promise
zurück, das mit einem GPURenderPipeline
erfüllt wird. Diese kann die Vertex- und Fragment-Shader-Stufen steuern und in einem GPURenderPassEncoder
oder GPURenderBundleEncoder
verwendet werden, sobald die Pipeline ohne Verzögerung verwendet werden kann.
Hinweis:
Es ist im Allgemeinen vorzuziehen, diese Methode anstelle von GPUDevice.createRenderPipeline()
zu verwenden, wann immer dies möglich ist, da sie das Blockieren der GPU-Betriebsausführung bei der Pipeline-Kompilierung verhindert.
Syntax
createRenderPipelineAsync(descriptor)
Parameter
descriptor
-
Siehe die Deskriptor-Definition für die Methode
GPUDevice.createRenderPipeline()
.
Rückgabewert
Ein Promise
, das mit einer GPURenderPipeline
-Objektinstanz erfüllt wird, wenn die erstellte Pipeline bereit ist, ohne zusätzliche Verzögerung verwendet zu werden.
Validierung
Wenn die Pipelinenerstellung fehlschlägt und infolgedessen die resultierende Pipeline ungültig wird, wird das zurückgegebene Promise mit einem GPUPipelineError
zurückgewiesen:
- Wenn dies auf einen internen Fehler zurückzuführen ist, hat der
GPUPipelineError
einenreason
von"internal"
. - Wenn dies aufgrund eines Validierungsfehlers geschieht, hat der
GPUPipelineError
einenreason
von"validation"
.
Ein Validierungsfehler kann auftreten, wenn eine der folgenden Bedingungen falsch ist:
- Für
depthStencil
-Objekte:format
ist eindepth-or-stencil
Format.- Die Eigenschaften
depthBias
,depthBiasClamp
unddepthBiasSlopeScale
sind für Linien- und Punkt-Topologien auf0
gesetzt, das heißt, wenntopology
auf"line-list"
,"line-strip"
oder"point-list"
gesetzt ist. - Wenn
depthWriteEnabled
true
ist oderdepthCompare
nicht"always"
ist, hatformat
eine Tiefenkomponente. - Wenn die Eigenschaften von
stencilFront
oderstencilBack
nicht auf ihren Standardwerten liegen, hatformat
eine Stencil-Komponente.
- Für
fragment
-Objekte:targets.length
ist kleiner oder gleich demmaxColorAttachments
Limit desGPUDevice
.- Für jedes
target
ist das numerische Äquivalent vonwriteMask
kleiner als 16. - Wenn eine der verwendeten Blendfaktor-Operationen den Alphakanal der Quelle verwendet (zum Beispiel
"src-alpha-saturated"
), hat die Ausgabe einen Alphakanal (das heißt, es muss einvec4
sein). - Wenn die
entryPoint
-Eigenschaft weggelassen wird, enthält der Shader-Code eine einzelne Fragment-Shader-Einstiegspunktfunktion, die vom Browser als Standardeinstiegspunkt verwendet werden kann.
- Für
primitive
-Objekte:- Wenn die
unclippedDepth
-Eigenschaft verwendet wird, ist diedepth-clip-control
Funktion aktiviert.
- Wenn die
- Für
vertex
-Objekte:- Wenn die
entryPoint
-Eigenschaft weggelassen wird, enthält der Shader-Code eine einzelne Vertex-Shader-Einstiegspunktfunktion, die vom Browser als Standardeinstiegspunkt verwendet werden kann.
- Wenn die
Beispiele
Hinweis: Die WebGPU-Beispiele enthalten viele weitere Beispiele.
Einfaches Beispiel
Das folgende Beispiel zeigt ein einfaches Beispiel für die Konstruktion eines gültigen Render-Pipeline-Deskriptor-Objekts, das dann verwendet wird, um eine GPURenderPipeline
via einem createRenderPipelineAsync()
-Aufruf zu erstellen.
async function init() {
// ...
const vertexBuffers = [
{
attributes: [
{
shaderLocation: 0, // position
offset: 0,
format: "float32x4",
},
{
shaderLocation: 1, // color
offset: 16,
format: "float32x4",
},
],
arrayStride: 32,
stepMode: "vertex",
},
];
const pipelineDescriptor = {
vertex: {
module: shaderModule,
entryPoint: "vertex_main",
buffers: vertexBuffers,
},
fragment: {
module: shaderModule,
entryPoint: "fragment_main",
targets: [
{
format: navigator.gpu.getPreferredCanvasFormat(),
},
],
},
primitive: {
topology: "triangle-list",
},
layout: "auto",
};
const renderPipeline =
await device.createRenderPipelineAsync(pipelineDescriptor);
// ...
}
Spezifikationen
Specification |
---|
WebGPU # dom-gpudevice-createrenderpipelineasync |
Browser-Kompatibilität
BCD tables only load in the browser
Siehe auch
- Die WebGPU API