TSL: Introduce array()

[sunag]

Closes #30097

Description

The implementation has two types of declarations array( [ ...nodes ] ) and array( 'type', count ). Both are compatible with .toConst() and .toVar() and have been updated in parse. TempNode has also been updated to automatically generate cache if .toVar() is not used.

// style 1 - constants
const a = array( [ vec3(), vec3() ] );

// style 1 - runtime values
const b = array( [ uniform( 1 ), a.element( 0 ).x ] );

// style 2 - constants
const c = array( 'vec3', 2 );

// style 3 - constants / runtime values
const d = vec3( 0, 0, 1 ).toArray( 2 ); // the result will be: [ vec3( 0, 0, 1 ), vec3( 0, 0, 1 ) ]

// .toVar() and assigns
const e = array( [ vec3(), vec3() ] ).toVar();
e.element( 0 ).assign( vec3() );

// .toConst()
const f = array( [ vec3(), vec3() ] ).toConst();
const v = f.element( 0 );

[github-actions]

📦 Bundle size

Full ESM build, minified and gzipped.

	Before	After	Diff
WebGL	336.25 78.28	336.25 78.28	+0 B +0 B
WebGPU	510.54 141.69	511.94 142.13	+1.41 kB +434 B
WebGPU Nodes	510 141.59	511.41 142.02	+1.41 kB +435 B

🌳 Bundle size after tree-shaking

Minimal build including a renderer, camera, empty scene, and dependencies.

	Before	After	Diff
WebGL	465.25 112.13	465.25 112.13	+0 B +0 B
WebGPU	584.54 158.41	585.91 158.79	+1.37 kB +386 B
WebGPU Nodes	539.92 147.96	541.29 148.37	+1.37 kB +407 B

[sunag]

@RenaudRohlinger I implemented your suggestion of .toArray() it can be done in just one line of code 023bd77. Now it can be used on any node, and can fill an array with default values, for example vec3( 0, 0, 1 ).toArray( 3 ).

[RenaudRohlinger]

Thanks for this! It’s great to see the NodeBuilder part in both our PRs is somehow similar. After learning @mrdoob code style, it feels like I’m finally starting to get the hang of @sunag style too! 🤭😁

[sunag]

Certainly yes, I'm happy to see how similar the PRs were. Always grateful for your help and suggestions :)

[Spiri0]

This is also important for DrawIndirect, since the frustum planes are needed in the compute shader. I've previously handled these as 6 individual vec4s in one struct. This fits perfectly with the struct expansion.

const frustum = array( 'vec4', 6 );

[Spiri0]

I mean I've been doing it like this so far:

//init the array
frustumArray = uniformArray( new Array( 6 ).fill().map( () => new THREE.Vector4() ) );

//update the array
frustumArray.array[ index ].set( plane.normal.x, plane.normal.y, plane.normal.z, plane.constant )

This works very well even with very large uniform arrays, but I wasn't sure whether this was the best solution