Description

It would be nice to

• load Three's built-in shader graphs in playground,
• tweak them as desired,
• save them with the save button,
• load them into an app,
• and finally assign them to the material customization points (f.e. positionNode, opacityNode, etc).

At the moment, the workflow is to look at Three.js source code if we want to replicate any existing graph, then write new (or copy/paste) stuff to achieve similar goals.

Solution

Some features of TSL seem not possible to express purely with "nodes" (or I missed it?), such as Fn and If (those nodes are also not present in the node playground, maybe for that reason), so I think to make this idea viable, the closure-based feature of TSL (Fn and related nodes) needs to have an alternative that is expressible purely as connected nodes without requiring the execution of function closures.

In Blender there are Switch and Math nodes that do things like greater than, less than, etc, for conditional logic. There could be similar in three nodes/TSL.

At first I thought If() would return a node I could simply pass along in top level plain JS (no closure), but then I learned about the requirement for Fn and function closures, which threw a wrench at my attempt at using purely nodes-connected-to-nodes.

I'm imagining pure conditional would be required for this to work well (and any Three internals using function closures ported to pure nodes).

Alternatives

.

Additional context

No response