Defines in TSL/WebGPU

Questions
1

Can anyone tell me how can i use defines in tsl.

I remember we do

#ifdef DEFINED_VALUE
  #if DEFINED_VALUE === 1
      // condition 1
  #endif
#endif

but in tsl there is no such way. I found one way from the official docs but there it’s saying just use javascript, like if else condition like we do in js or we can use any orther way that’s vaild in js.

but I don’t know when i update that defined value how can i update the Fn() code block.
I tried doing material.needsUpdate = true but that’s not working.

2

WGSL does not support preprocessor directives so there is no support for this in TSL. There are cleaner solutions since during setup time you can branch TSL with classic JavaScript if/else statements. Do you mind demonstrating with a live example what you are doing?

1 Like
3

I am building a tool using webgpu-postprocessing, and there are some effects that need to have that defined logic.

4

Wouldn’t you make two/more graphs, instead?

5

I didn’t get that.

6

myMaterialWithoutDefine

myMaterialWithDefine

myMaterialWithDefineAndCondition

7

It is not the idea to have multiple materials. Instead, you can check in JavaScript conditions that were previously embedded in the shader as a define. Let me give you one concrete example:

In WebGLRenderer , the shader chunk for normals maps uses defines like USE_NORMALMAP_TANGENTSPACE to create branches with different GLSL code. In TSL, we can check these conditions directly in JavaScript and then create different TSL.

If you would change the normal map type and then notify the node material system to rebuild the material, setup() is called again and different TSL is generated. This works for all nodes, even the ones used for post processing.

1 Like
8

Would this ultimately make different shaders / programs? I never quite understood how a in ifdef worked.

It would make sense to setup all three branches ahead of time in say case of a game?

9

If you change the value of a define in WebGLRenderer, a recompile is required. That also true when the TSL source changes in WebGPURenderer. In both cases, you end up with a different shader.

2 Likes
10

Thank you, @Mugen87 . Found the solution. Yeah, using a normal JS condition worked.
I just forgot to do.
postprocessing.needsUpdate = true

1 Like