TSL: use addMethodsChaining

[linbingquan]

Related PR: #30201

Description

Simple test. Probably doesn't help the packing volume.

[github-actions]

📦 Bundle size

Full ESM build, minified and gzipped.

	Before	After	Diff
WebGL	339.44 79.06	339.44 79.06	+0 B +0 B
WebGPU	488.27 135.68	488.19 135.66	-82 B -21 B
WebGPU Nodes	487.74 135.56	487.65 135.54	-82 B -23 B

🌳 Bundle size after tree-shaking

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

	Before	After	Diff
WebGL	465.3 112.11	465.3 112.11	+0 B +0 B
WebGPU	558.06 151.21	557.96 151.18	-104 B -27 B
WebGPU Nodes	514.13 140.95	514.03 140.91	-104 B -43 B

[Mugen87]

TBH, I find the previous more explicit version easier to read.

More compact code is not necessary something we are heading for. If you use a build system with a minifier, the improvements in size do usually not matter.

[linbingquan]

Just to simplily test it out, the code minify looks like:

code

import { addMethodChaining } from "three/tsl";

// this method does not in r171, we add it here.
function addMethodsChaining(object: Record<string, unknown>) {
    for (const key in object) {
        addMethodChaining(key, object[key]);
    }
}

const NOOP = () => {};

addMethodChaining( 'test', NOOP );
addMethodChaining( 'dev', NOOP );

addMethodsChaining({
    test: NOOP,
    dev: NOOP
});

minify result:

function TN(e){for(const t in e)Fo(t,e[t])}const Yi=()=>{};Fo("test",Yi),Fo("dev",Yi),TN({test:Yi,dev:Yi});

Fo("test",Yi),Fo("dev",Yi) is longer than TN({test:Yi,dev:Yi})

[sunag]

I compared this logic with exporter, sometimes it can be useful to have export { a, b c } instead of export a; export b; export c;

[mrdoob]

TBH, I find the previous more explicit version easier to read.

+1

[sunag]

@Mugen87 @mrdoob If you both prefer I will revert it in this release.

[mrdoob]

Yes please 🙏