VOOZH about

URL: https://developer.mozilla.org/en-US/docs/Web/API/GPUDevice/createPipelineLayout

⇱ GPUDevice: createPipelineLayout() method - Web APIs | MDN


GPUDevice: createPipelineLayout() method

Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

Note: This feature is available in Web Workers.

The createPipelineLayout() method of the GPUDevice interface creates a GPUPipelineLayout that defines the GPUBindGroupLayouts used by a pipeline. GPUBindGroups used with the pipeline during command encoding must have compatible GPUBindGroupLayouts.

Syntax

js
createPipelineLayout(descriptor)

Parameters

descriptor

An object containing the following properties:

bindGroupLayouts

An array of values representing the bind group layouts for a pipeline. Each value can be:

label Optional

A string providing a label that can be used to identify the object, for example in GPUError messages or console warnings.

Return value

A GPUPipelineLayout object instance.

Validation

The following criteria must be met when calling createPipelineLayout(), otherwise a GPUValidationError is generated and an invalid GPUPipelineLayout object is returned:

Examples

Note: The WebGPU samples feature many more examples.

Multiple bind group layouts, bind group, and pipeline layout

The following snippet:

js
// …

const bindGroupLayout = device.createBindGroupLayout({
 entries: [
 {
 binding: 0,
 visibility: GPUShaderStage.VERTEX | GPUShaderStage.FRAGMENT,
 buffer: {},
 },
 {
 binding: 1,
 visibility: GPUShaderStage.FRAGMENT,
 texture: {},
 },
 {
 binding: 2,
 visibility: GPUShaderStage.FRAGMENT,
 sampler: {},
 },
 ],
});

const pipelineLayout = device.createPipelineLayout({
 bindGroupLayouts: [bindGroupLayout],
});

// …

Specifying an empty bind group layout

In this snippet, we create three bind group layouts, with bind group layout 1 representing fragment data and bind group layout 2 representing vertex data. If we want to create a pipeline that uses only bind group layouts 0 and 2, we can pass null for bind group layout 1 and then render without a fragment shader.

js
const bgl0 = device.createBindGroupLayout({ entries: myGlobalEntries });
const bgl1 = device.createBindGroupLayout({ entries: myFragmentEntries });
const bgl2 = device.createBindGroupLayout({ entries: myVertexEntries });

// pipeline layout can be used to render without a fragment shader
const pipelineLayout = device.createPipelineLayout({
 bindGroupLayouts: [bgl0, null, bgl2],
});

Specifications

Specification
WebGPU
# dom-gpudevice-createpipelinelayout

Browser compatibility

See also

Help improve MDN

Learn how to contribute

This page was last modified on by MDN contributors.