Back to Content

GPUBindGroupLayout

files/en-us/web/api/gpubindgrouplayout/index.md

latest1.5 KB
Original Source

{{APIRef("WebGPU API")}}{{SecureContext_Header}}{{AvailableInWorkers}}

The GPUBindGroupLayout interface of the {{domxref("WebGPU API", "WebGPU API", "", "nocode")}} defines the structure and purpose of related GPU resources such as buffers that will be used in a pipeline, and is used as a template when creating {{domxref("GPUBindGroup")}}s.

A GPUBindGroupLayout object instance is created using the {{domxref("GPUDevice.createBindGroupLayout()")}} method.

{{InheritanceDiagram}}

Instance properties

  • {{domxref("GPUBindGroupLayout.label", "label")}}
    • : A string providing a label that can be used to identify the object, for example in {{domxref("GPUError")}} messages or console warnings.

Examples

[!NOTE] The WebGPU samples feature many more examples.

Basic example

Our basic compute demo shows an example of creating a bind group layout and then using that as a template when creating a bind group.

js
// …

const bindGroupLayout = device.createBindGroupLayout({
  entries: [
    {
      binding: 0,
      visibility: GPUShaderStage.COMPUTE,
      buffer: {
        type: "storage",
      },
    },
  ],
});

const bindGroup = device.createBindGroup({
  layout: bindGroupLayout,
  entries: [
    {
      binding: 0,
      resource: {
        buffer: output,
      },
    },
  ],
});

// …

Specifications

{{Specifications}}

Browser compatibility

{{Compat}}

See also