系列博客总目录:https://segmentfault.com/a/1190000040716735
对应文档中的 https://www.w3.org/TR/webgpu/...
对于着色器模块的创立,与 WebGL 中的 Shader 有改良,提供了编译信息。
GPUShaderModule 接口
这个接口是能够序列化的,意味着能够传递其援用进行多线程编程。
它是不可变对象(只读),所以不存在抵触的问题。
[Exposed=(Window, DedicatedWorker), SecureContext]interface GPUShaderModule { Promise<GPUCompilationInfo> compilationInfo();};GPUShaderModule includes GPUObjectBase;
创立
创立一个 GPUShaderModule,须要调用 device.createShaderModule
办法。
此办法承受一个 GPUShaderModuleDescriptor
接口类型的对象,它不能为空对象,也不能不传递。
dictionary GPUShaderModuleDescriptor : GPUObjectDescriptorBase { required USVString code; object sourceMap;};
如果传递了 sourceMap
,即可应用一些工具来调试。这个是可选的。
例子:
const vsModule = device.createShaderModule({ code: ` struct PositionColorInput { [[location(0)]] in_position_2d: vec2<f32>; [[location(1)]] in_color_rgba: vec4<f32>; }; struct PositionColorOutput { [[builtin(position)]] coords_output: vec4<f32>; [[location(0)]] color_output: vec4<f32>; }; // 能够写正文 [[stage(vertex)]] fn main(input: PositionColorInput) -> PositionColorOutput { var output: PositionColorOutput; output.color_output = input.in_color_rgba; output.coords_output = vec4<f32>(input.in_position_2d, 0.0, 1.0); return output; } `})const fsModule = device.createShaderModule({ code: ` [[stage(fragment)]] fn main([[location(0)]] in_color: vec4<f32>) -> [[location(0)]] vec4<f32> { return in_color; }`,})
获取编译信息
enum GPUCompilationMessageType { "error", "warning", "info"};[Exposed=(Window, DedicatedWorker), Serializable, SecureContext]interface GPUCompilationMessage { readonly attribute DOMString message; readonly attribute GPUCompilationMessageType type; readonly attribute unsigned long long lineNum; readonly attribute unsigned long long linePos; readonly attribute unsigned long long offset; readonly attribute unsigned long long length;};[Exposed=(Window, DedicatedWorker), Serializable, SecureContext]interface GPUCompilationInfo { readonly attribute FrozenArray<GPUCompilationMessage> messages;};
编译信息是由 GPUShaderModule
在编译着色器代码时生成的编译日志,包含信息、正告、谬误。
开发者能够通过调用 shaderModule.compilationInfo()
并 await 其 resolve 值查看编译信息对象。
编译信息对象实现自接口 GPUCompilationInfo
,它包含了字符串音讯 message
、编译信息类型 type
、着色器代码行数 lineNum
、着色器代码行哪个字符 linePos
、着色器代码中的地位 offset
以及代码单元个数 length
几个属性。
留神,个别比拟罕用 lineNum
和 linePos
,比拟合乎代码编辑器里的行和列。
举例:
给一段旧版本的谬误 WGSL 代码:
const fsModule = device.createShaderModule({ code: ` [[location(0)]] var<out> outColor: vec4<f32>; [[stage(fragment)]] fn main() -> void { outColor = vec4<f32>(1.0, 0.2, 0.4, 1.0); return; } `,})
编译时控制台会报错:
获取编译信息: