GPUDevice: createRenderPipeline() 方法
注意:此功能在 Web Workers 中可用。
GPUDevice 接口的 createRenderPipeline() 方法创建 GPURenderPipeline,可控制顶点和片段着色器阶段,并可在 GPURenderPassEncoder 或 GPURenderBundleEncoder 中使用。
语法
createRenderPipeline(descriptor)
参数
描述符(descriptor)-
包含以下属性的对象:
depthStencil可选-
一个对象(参见
depthStencil对象结构),描述深度模板属性,包括测试、操作和偏差。 fragment可选-
一个对象(参见
fragment对象结构),描述管线的片段着色器入口点及其输出颜色。如果未定义片段着色器入口点,管线将不产生任何颜色附件输出,但仍会执行光栅化并根据顶点位置输出产生深度值。深度测试和模板操作仍然可以使用。 label可选-
一个字符串,提供可用于识别对象的标签,例如在
GPUError消息或控制台警告中。 layout-
定义管线执行期间使用的所有 GPU 资源(缓冲区、纹理等)的布局(结构、目的和类型)。可能的值包括:
- 一个
GPUPipelineLayout对象,使用GPUDevice.createPipelineLayout()创建,允许 GPU 提前找出如何最有效地运行管线。 - 字符串
"auto",这将导致管线根据着色器代码中定义的任何绑定生成隐式绑定组布局。如果使用"auto",生成的绑定组布局只能与当前管线一起使用。
- 一个
multisample可选-
一个对象(参见
multisample对象结构),描述管线如何与渲染通道的多采样附件交互。 primitive可选-
一个对象(参见
primitive对象结构),描述管线如何从其顶点输入构造和光栅化图元。 顶点(vertex)-
一个对象(参见
vertex对象结构),描述管线的顶点着色器入口点及其输入缓冲区布局。
depthStencil 对象结构
depthStencil 对象可以包含以下属性:
depthBias可选-
一个数字,表示添加到每个片段的常量深度偏差。如果省略,
depthBias默认为 0。注意:对于线和点拓扑,即如果
topology设置为"line-list"、"line-strip"或"point-list",则depthBias、depthBiasClamp和depthBiasSlopeScale属性必须设置为0。否则,将生成GPUValidationError,并且返回的GPURenderPipeline将无效。 depthBiasClamp可选-
一个数字,表示片段的最大深度偏差。如果省略,
depthBiasClamp默认为 0。 depthBiasSlopeScale可选-
一个数字,表示随片段斜率缩放的深度偏差。如果省略,
depthBiasSlopeScale默认为 0。 depthCompare可选-
一个枚举值,指定用于将片段深度与
depthStencilAttachment深度值进行测试的比较操作。可能的值为:"never":比较测试永不通过。"less":如果提供的值小于采样值,则通过比较测试。"equal":如果提供的值等于采样值,则通过比较测试。"less-equal":如果提供的值小于或等于采样值,则通过比较测试。"greater":如果提供的值大于采样值,则通过比较测试。"not-equal":如果提供的值不等于采样值,则通过比较测试。"greater-equal":如果提供的值大于或等于采样值,则通过比较测试。"always":比较测试始终通过。
如果指定的
format没有深度分量,或者未使用比较操作,则不需要depthCompare。 depthWriteEnabled可选-
一个布尔值。值为
true表示GPURenderPipeline可以在创建后修改depthStencilAttachment深度值。设置为false表示不能。如果指定的
format没有深度分量,则不需要depthWriteEnabled。 格式(format)-
一个枚举值,指定
GPURenderPipeline将兼容的depthStencilAttachment格式。所有可用的format值请参阅规范的 纹理格式 部分。 stencilBack可选-
一个对象,定义如何对背面图元执行模板比较和操作。其属性可以包括:
compare可选-
一个枚举值,指定在将片段与
depthStencilAttachment模板值进行测试时使用的比较操作。可能的值与depthCompare属性相同;参见上文。如果省略,compare默认为"always"。 depthFailOp可选-
一个枚举值,指定如果
depthCompare描述的片段深度比较失败时执行的模板操作。可能的值为:"decrement-clamp":递减当前渲染状态的模板值,并将其钳制到 0。"decrement-wrap":递减当前渲染状态的模板值,如果值小于 0,则将其循环到depthStencilAttachment模板方面的最大可表示值。"invert":按位反转当前渲染状态的模板值。"increment-clamp":递增当前渲染状态的模板值,并将其钳制到depthStencilAttachment模板方面的最大可表示值。"increment-wrap":递增当前渲染状态的模板值,如果值超过depthStencilAttachment模板方面的最大可表示值,则将其循环到 0。"keep":保持当前模板值。"replace":将模板值设置为当前渲染状态的模板值。"zero":将模板值设置为 0。
如果省略,
depthFailOp默认为"keep"。注意:渲染状态模板值在渲染通道开始时初始化为 0。
failOp可选-
一个枚举值,指定如果
compare描述的片段模板比较测试失败时执行的模板操作。可能的值和默认值与depthFailOp相同。 passOp可选-
一个枚举值,指定如果
compare描述的片段模板比较测试通过时执行的模板操作。可能的值和默认值与depthFailOp相同。
stencilFront可选-
一个对象,定义如何对正面图元执行模板比较和操作。其属性与
stencilBack相同。 stencilReadMask可选-
一个位掩码,控制在执行模板比较测试时读取
depthStencilAttachment模板值的哪些位。如果省略,stencilReadMask默认为0xFFFFFFFF。 stencilWriteMask可选-
一个位掩码,控制在执行模板操作时写入
depthStencilAttachment模板值的哪些位。如果省略,stencilWriteMask默认为0xFFFFFFFF。
注意:depthStencilAttachment 值在 GPUCommandEncoder.beginRenderPass() 调用期间指定,即 GPURenderPipeline 实际用于执行渲染通道时。
fragment 对象结构
fragment 对象包含一个对象数组,每个对象可以包含以下属性:
constants可选-
一系列记录类型,结构为
(id, value),表示 管线中可被覆盖的 WGSL 常量 的覆盖值。这些行为类似于 有序映射。在每种情况下,id是用于识别或选择记录的键,constant是表示 WGSL 的枚举值。根据要覆盖的常量,
id可以采用常量的数字 ID 形式(如果已指定),或者常量的标识符名称。一个提供多个可覆盖常量的覆盖值的代码片段可能如下所示:
js({ // … constants: { 0: false, 1200: 3.0, 1300: 2.0, width: 20, depth: -1, height: 15, }, }); entryPoint可选-
module中此阶段将用于执行其工作的函数的名称。相应的着色器函数必须具有@fragment属性才能被识别为入口点。有关更多信息,请参阅 入口点声明。如果着色器代码包含一个设置了
@fragment属性的单个函数,则可以省略entryPoint属性——浏览器将使用它作为默认入口点。如果省略entryPoint且浏览器无法确定默认入口点,则会生成GPUValidationError,并且生成的GPURenderPipeline将无效。 模块-
一个
GPUShaderModule对象,包含此可编程阶段将执行的 WGSL 代码。 目标(targets)-
一个对象数组,表示颜色状态,这些颜色状态表示片段着色器阶段输出的颜色的配置细节。这些对象可以包含以下属性:
blend可选-
一个对象,描述要应用于输出颜色的混合模式。
blend有两个属性:alpha和color都接受一个对象作为值,该对象可以包含以下属性:dstFactor可选-
一个枚举值,定义要对来自目标附件的值执行的混合因子操作。可能的值为:
"constant""dst""dst-alpha""one""one-minus-dst""one-minus-src""one-minus-src1""one-minus-src-alpha""one-minus-src1-alpha""one-minus-dst-alpha""one-minus-constant""src""src1""src-alpha""src1-alpha""src-alpha-saturated""zero"
如果省略,
dstFactor默认为"zero"。注意:需要启用
dual-source-blending功能 才能成功使用src1、one-minus-src1、src1-alpha和one-minus-src1-alpha混合因子操作。否则,将生成GPUValidationError。 operation可选-
一个枚举值,定义用于组合源和目标混合因子以计算写入目标附件组件的最终值的算法。可能的值为:
"add""max""min""reverse-subtract""subtract"
如果省略,
operation默认为"add"。 srcFactor可选-
一个枚举值,定义要对来自片段着色器的值执行的混合因子操作。可能的值与
dstFactor相同。如果省略,srcFactor默认为"one"。
注意:有关每个
dstFactor/srcFactor和operation枚举值定义的算法的详细说明,请参阅规范的 混合状态 部分。 格式(format)-
一个枚举值,指定输出颜色所需的格式。所有可用的
format值请参阅规范的 纹理格式 部分。 writeMask可选-
一个或多个 位标志,定义应用于颜色目标状态的写入掩码。可能的标志值为:
GPUColorWrite.REDGPUColorWrite.GREENGPUColorWrite.BLUEGPUColorWrite.ALPHAGPUColorWrite.ALL
如果省略,
writeMask默认为GPUColorWrite.ALL。请注意,可以通过使用 按位或 分隔值来指定多个标志,例如:
GPUColorWrite.RED | GPUColorWrite.ALPHA。
multisample 对象结构
multisample 对象可以包含以下属性:
alphaToCoverageEnabled可选-
一个布尔值。值为
true表示片段的 alpha 通道应用于生成样本覆盖掩码。如果省略,alphaToCoverageEnabled默认为false。 count可选-
一个数字,定义每个像素的样本数。管线将仅与具有匹配
sampleCounts的附件纹理(colorAttachment和depthStencilAttachment)(参见GPUTexture)兼容。如果省略,
count默认为 1。 mask可选-
一个位掩码,确定写入哪些样本。如果省略,
mask默认为0xFFFFFFFF。
注意:colorAttachment 和 depthStencilAttachment 值在 GPUCommandEncoder.beginRenderPass() 调用期间指定,即 GPURenderPipeline 实际用于执行渲染通道时。
primitive 对象结构
primitive 对象可以包含以下属性:
cullMode可选-
一个枚举值,定义将剔除哪个多边形方向(如果有)。可能的值为:
"back":剔除背面多边形。"front":剔除正面多边形。"none":不剔除任何多边形。
如果省略,
cullMode默认为"none"。 frontFace可选-
一个枚举值,定义哪些多边形被认为是正面。可能的值为:
"ccw":顶点帧缓冲区坐标以逆时针顺序给出多边形。"cw":顶点帧缓冲区坐标以顺时针顺序给出多边形。
如果省略,
frontFace默认为"ccw"。注意:
frontFace和cullMode值对"point-list"、"line-list"或"line-strip"拓扑没有影响。 stripIndexFormat可选-
一个枚举值,在管线具有条带拓扑(
"line-strip"或"triangle-strip")的情况下,确定索引缓冲区格式和图元重启值。图元重启值指定哪个索引值表示应该开始一个新的图元,而不是继续使用先前的索引顶点构造条带。可能的值为:"uint16":表示字节大小为 2,图元重启值为0xFFFF。"uint32":表示字节大小为 4,图元重启值为0xFFFFFFFF。
指定条带图元拓扑的 GPU 图元状态必须在用于索引绘制(例如,通过
GPURenderPassEncoder.drawIndexed())时指定条带索引格式,以便在管线创建时知道将使用的图元重启值。具有列表图元拓扑("line-list"、"point-list"或"triangle-list")的管线不应指定stripIndexFormat值。它们将转而使用在进行索引渲染时传递给GPURenderPassEncoder.setIndexBuffer()的索引格式。 topology可选-
一个枚举值,定义要从指定的
vertex输入构造的图元类型。可能的值为:"line-list":每连续一对两个顶点定义一个线图元。"line-strip":第一个顶点后的每个顶点都定义它与前一个顶点之间的线图元。"point-list":每个顶点定义一个点图元。"triangle-list":每连续三个顶点定义一个三角形图元。"triangle-strip":前两个顶点后的每个顶点都定义它与前两个顶点之间的三角形图元。
如果省略,
topology默认为"triangle-list"。 unclippedDepth可选-
一个布尔值。值为
true表示禁用深度裁剪。如果省略,unclippedDepth默认为false。请注意,要控制深度裁剪,必须在GPUDevice中启用depth-clip-control功能。注意:需要启用
depth-clip-control功能 才能成功使用unclippedDepth属性。否则,将生成GPUValidationError。
vertex 对象结构
vertex 对象可以包含以下属性:
constants可选-
一系列记录类型,结构为
(id, value),表示 管线中可被覆盖的 WGSL 常量 的覆盖值。这些行为类似于 有序映射。在每种情况下,id是用于识别或选择记录的键,constant是表示 WGSL 的枚举值。根据要覆盖的常量,
id可以采用常量的数字 ID 形式(如果已指定),或者常量的标识符名称。一个提供多个可覆盖常量的覆盖值的代码片段可能如下所示:
js({ // … constants: { 0: false, 1200: 3.0, 1300: 2.0, width: 20, depth: -1, height: 15, }, }); entryPoint可选-
module中此阶段将用于执行其工作的函数的名称。相应的着色器函数必须具有@vertex属性才能被识别为入口点。有关更多信息,请参阅 入口点声明。如果着色器代码包含一个设置了
@vertex属性的单个函数,则可以省略entryPoint属性——浏览器将使用它作为默认入口点。如果省略entryPoint且浏览器无法确定默认入口点,则会生成GPUValidationError,并且生成的GPURenderPipeline将无效。 模块-
一个
GPUShaderModule对象,包含此可编程阶段将执行的 WGSL 代码。 buffers可选-
一个对象数组,每个对象表示管线中使用的顶点缓冲区的预期布局。每个对象可以包含以下属性:
数组步长(arrayStride)-
一个数字,表示缓冲区内不同结构(例如,顶点)之间的步长(以字节为单位)。
attributes-
一个对象数组,定义每个结构中顶点属性的布局。每个对象具有以下属性:
格式(format)-
一个枚举值,指定顶点的格式。有关所有可用值,请参阅规范中的
GPUVertexFormat定义。 offset-
一个数字,指定从结构开始到属性数据的偏移量(以字节为单位)。
着色器位置(shaderLocation)-
与此属性关联的数字位置,该位置将与
vertex对象的module属性中引用的关联GPUShaderModule的 WGSL 代码中声明的@location属性相对应。
stepMode可选-
一个枚举值,定义缓冲区内独立结构是表示顶点还是实例。可能的值为:
"instance":每个结构都是一个实例——每个实例的地址都按arrayStride递增。"vertex":每个结构都是一个顶点——每个顶点的地址都按arrayStride递增,并在实例之间重置。
如果省略,
stepMode默认为"vertex"。
返回值
一个 GPURenderPipeline 对象实例。
验证
调用 createRenderPipeline() 时必须满足以下条件,否则将生成 GPUValidationError 并返回无效的 GPURenderPipeline 对象:
- 对于
depthStencil对象:format是depth-or-stencil格式。- 对于线和点拓扑,即如果
topology设置为"line-list"、"line-strip"或"point-list",则depthBias、depthBiasClamp和depthBiasSlopeScale属性设置为0。 - 如果
depthWriteEnabled为true或depthCompare不为"always",则format具有深度分量。 - 如果
stencilFront或stencilBack的属性不为默认值,则format具有模板分量。
- 对于
fragment对象:targets.length小于或等于GPUDevice的maxColorAttachments限制。- 对于每个
target,writeMask的数值等价小于 16。 - 如果任何使用的混合因子操作使用源 alpha 通道(例如
"src-alpha-saturated"),则输出具有 alpha 通道(即,它必须是vec4)。 - 如果使用
src1、one-minus-src1、src1-alpha或one-minus-src1-alpha混合因子操作,则启用dual-source-blending功能。 - 如果省略
entryPoint属性,则着色器代码包含单个片段着色器入口点函数供浏览器用作默认入口点。
- 对于
primitive对象:- 如果使用
unclippedDepth属性,则启用depth-clip-control功能。
- 如果使用
- 对于
vertex对象:- 如果省略
entryPoint属性,则着色器代码包含单个顶点着色器入口点函数供浏览器用作默认入口点。
- 如果省略
示例
注意:WebGPU 示例 提供了更多示例。
基本示例
我们的基本渲染演示 提供了一个有效渲染管线描述符对象的构建示例,该对象随后通过 createRenderPipeline() 调用用于创建 GPURenderPipeline。
// …
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 = device.createRenderPipeline(pipelineDescriptor);
// …
规范
| 规范 |
|---|
| WebGPU # dom-gpudevice-createrenderpipeline |
浏览器兼容性
加载中…