ThecreateComputePipeline() method of theGPUDevice interface creates aGPUComputePipeline that can control the compute shader stage and be used in aGPUComputePassEncoder.

Syntax

createComputePipeline(descriptor)

Parameters

descriptor

An object containing the following properties:

compute

An object describing the compute shader entry point of the pipeline. This object can contain the following properties:

constantsOptional

A sequence of record types, with the structure(id, value), representing override values forWGSL constants that can be overridden in the pipeline. These behave likeordered maps. In each case, theid is a key used to identify or select the record, and theconstant is an enumerated value representing a WGSL.

Depending on which constant you want to override, theid may take the form of the numeric ID of the constant, if one is specified, or otherwise the constant's identifier name.

A code snippet providing override values for several overridable constants might look like this:

js

({  // …  constants: {    0: false,    1200: 3.0,    1300: 2.0,    width: 20,    depth: -1,    height: 15,  },});

entryPointOptional

The name of the function in themodule that this stage will use to perform its work. The corresponding shader function must have the@compute attribute to be identified as this entry point. SeeEntry Point Declaration for more information.

You can omit theentryPoint property if your shader code contains a single function with the@compute attribute set — the browser will use this as the default entry point. IfentryPoint is omitted and the browser cannot determine a default entry point, aGPUValidationError is generated and the resultingGPUComputePipeline will be invalid.

module

AGPUShaderModule object containing theWGSL code that this programmable stage will execute.

labelOptional

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

layout

Defines the layout (structure, purpose, and type) of all the GPU resources (buffers, textures, etc.) used during the execution of the pipeline. Possible values are:

• AGPUPipelineLayout object, created usingGPUDevice.createPipelineLayout(), which allows the GPU to figure out how to run the pipeline most efficiently ahead of time.
• A string of"auto", which causes the pipeline to generate an implicit bind group layout based on any bindings defined in the shader code. If"auto" is used, the generated bind group layouts may only be used with the current pipeline.

Return value

AGPUComputePipeline object instance.

Validation

The following criteria must be met when callingcreateComputePipeline(), otherwise aGPUValidationError is generated and an invalidGPUComputePipeline object is returned:

• The workgroup storage size used by themodule referenced inside thecompute property is less than or equal to theGPUDevice'smaxComputeWorkgroupStorageSizelimit.
• Themodule uses a number of compute invocations per workgroup less than or equal to theGPUDevice'smaxComputeInvocationsPerWorkgrouplimit.
• Themodule's workgroup size is less than or equal to theGPUDevice's correspondingmaxComputeWorkgroupSizeX,maxComputeWorkgroupSizeY, ormaxComputeWorkgroupSizeZlimit.
• If theentryPoint property is omitted, the shader code contains a single compute shader entry point function for the browser to use as the default entry point.

Examples

Basic example

Ourbasic compute demo shows a process of:

• Creating a bind group layout withGPUDevice.createBindGroupLayout().
• Feeding thebindGroupLayout intoGPUDevice.createPipelineLayout() to create aGPUPipelineLayout.
• Using that value immediately in acreateComputePipeline() call to create aGPUComputePipeline.

// …const bindGroupLayout = device.createBindGroupLayout({  entries: [    {      binding: 0,      visibility: GPUShaderStage.COMPUTE,      buffer: {        type: "storage",      },    },  ],});const computePipeline = device.createComputePipeline({  layout: device.createPipelineLayout({    bindGroupLayouts: [bindGroupLayout],  }),  compute: {    module: shaderModule,    entryPoint: "main",  },});// …

Specifications

Browser compatibility

See also

• TheWebGPU API