TSL: Deferred function call and .once()

[sunag]

Description

All TSL function calls are deferred to compilation time, if this is not the desired action just create a simple JS function. The Fn.once() update allows only one function call to be made per material.

// use Fn().once() to call the function only once in compilation, 
// it will reuse the return value of the last call.

const normalViewFn = Fn( ( builder ) => {

	let node;

	if ( builder.material.flatShading === true ) {

		node = normalFlat;

	} else {

		node = varying( modelNormalMatrix.mul( normalLocal ), 'v_normalView' ).normalize();

	}

	return node;

} ).once(); 

// With deferred once functions we can have constants that can obtain 
// important data from the material, object and renderer at compile time.

export const normalView = normalViewFn().toVar( 'normalView' );

The use for the end user is the same if he would use a constant.

import { normalView } from 'three/tsl';

material.normalNode = normalView;

Optional output type has also been added to the function, this can help to optimize and avoid call overload.

const normalViewFn = Fn( function(){}, 'vec3' );

[github-actions]

📦 Bundle size

Full ESM build, minified and gzipped.

Filesize dev	Filesize PR	Diff
685.1 kB (169.6 kB)	685.1 kB (169.6 kB)	+0 B

🌳 Bundle size after tree-shaking

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

Filesize dev	Filesize PR	Diff
462 kB (111.4 kB)	462 kB (111.4 kB)	+0 B

[linbingquan]

@sunag

Can we let Fn() execute itself in the setup* phase, the user should have less learning costs and write less code.

I was try to execute colorNode in NodeMaterial.setupDiffuseColor(), it can work.

Before:

material.colorNode = Fn( () => {} )()

After:

material.colorNode = Fn( () => {} )

I'm not sure it's a good idea, also I'm not sure if there are other questions.

[sunag]

I think it could have other name like the example below, because Fn() will return a function and not a Node, this could make the subsequent process easier:

const Shader = ( ...params ) => Fn( ...params )();

material.colorNode = Shader( () => {} );