Creating Arrays in TSL

I’ve been experimenting with using TSL to create shaders that are analogous to some WGSL shaders I’ve previously written, however I’m not sure what the TSL equivalent is of locally creating an array that can be used within a vertexShader (i.e an array that is not a passed in storage buffer, but an array that is modified or created locally within a vertexShader based on parameters that the shader receives).

1 Like

Maybe this can help?

1 Like

Thanks sunag! I’ll update this thread later when I’ve determined whether using uniforms() works for my use case. For the future, it would be nice to have some way to create a read-only storage buffer for instances where such a buffer would be useful or necessary (i.e passing a storage buffer to a vertex shader, a shader stage that, according to the WebGPU API, will only accept storage buffers that are read-only).

Easy Array Declaration For TSL Fn Contexts

Uniforms could work for my use-case too but I was also eager for an inline array solution in my TSL function. There’s an array node and was able to declare and reference like so:

import { array /*your other tsl imports*/} from 'three/tsl';
	const offsets = array([vec2(0.), vec2(.5), vec2(-.5),
                              vec2(.5,0.), vec2(-.5,0.),
                              vec2(0.,.5), vec2(0.,-.5),
                              vec2(.5,-.5), vec2(-.5,.5)]);
//...
	Loop( { start: 0, end: 9 }, ( { i } ) => {
		const shiftedUV = uvMutable.mul( 4.0 ).add( offsets.element( i ) );
//...
  • Note: You DO NOT use normal yourArray[i] lookup syntax, instead yourArray.element(i) – This is similar to how instanced attributes work in syntactic style.

  • Note2: You pass the array function an array and not each element as an arg.

  • Note3: At this time of this post the GLSL to TSL transpiler won’t bring across array values but creates TSL code that doesn’t error, You’ve been warned.

( I’d assume this type of shader-array is a readonly array (CC @cmhhelgeson))