TSL: Add debug()

[sunag]

Related issue: #30783 (comment)

Description

Add debug() method to facilitate inspection of the generated code.

const timerScaleNode = time.mul( vec2( - 0.5, 0.1 ) );
const animateUV = uv().add( timerScaleNode );

materialBox.colorNode = checker( animateUV ).toVar().debug();

Alternative

materialBox.colorNode = uv().debug( ( code ) => {

	console.log( code );

} )

WGSL Result

// #--- TSL Debug ---#
nodeVar0 = ( ( nodeVarying3 + ( vec2<f32>( render.nodeUniform0 ) * vec2<f32>( -0.5, 0.1 ) ) ) * vec2<f32>( 2.0 ) );
nodeVar1 = sign( ( ( floor( nodeVar0.x ) + floor( nodeVar0.y ) ) % 2.0 ) );

/* ... */ nodeVar1 /* ... */
// #-----------------#

GLSL Result

// #--- TSL Debug ---#
nodeVar0 = ( ( nodeVarying3 + ( vec2( f_nodeUniform0 ) * vec2( -0.5, 0.1 ) ) ) * vec2( 2.0 ) );
nodeVar1 = sign( mod( ( floor( nodeVar0.x ) + floor( nodeVar0.y ) ), 2.0 ) );

/* ... */ nodeVar1 /* ... */
// #-----------------#

[github-actions]

📦 Bundle size

Full ESM build, minified and gzipped.

	Before	After	Diff
WebGL	336.08 78.29	336.08 78.29	+0 B +0 B
WebGPU	530.63 147.4	531.17 147.59	+548 B +198 B
WebGPU Nodes	530.09 147.29	530.64 147.49	+548 B +197 B

🌳 Bundle size after tree-shaking

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

	Before	After	Diff
WebGL	465.15 112.18	465.15 112.18	+0 B +0 B
WebGPU	602.3 163.4	602.81 163.54	+513 B +135 B
WebGPU Nodes	557.34 152.84	557.85 152.97	+513 B +131 B

[Makio64]

thanks @sunag ! <3

[brunosimon]

Great idea