Loop
Implements iterative calculations (equivalent to a for-loop) in shaders, fundamental for procedural generation, accumulative effects, and advanced iterative algorithms.
Core Advantages
Its core value is unlocking procedural generation capabilities on the GPU. It abstracts low-level GLSL for-loops into a clean TSL node, allowing developers to elegantly implement complex algorithms like ray marching and fractal noise without manual loop unrolling or GLSL string concatenation, achieving powerful results while maintaining code readability and performance.
Common Uses
Acting as a 'stepping engine' in ray marching to advance rays step-by-step for rendering SDFs.
Serving as an 'octave accumulator' for Fractal Brownian Motion (fBm) to create complex textures by layering noise at different frequencies.
Functioning as a 'multi-sampler' in advanced post-processing (e.g., Bokeh blur) to sample surrounding pixels iteratively.
Working as a 'nearest-neighbor searcher' for Voronoi diagrams to iterate through feature points and find the closest one.
How to adjust
Adjusting the `end` parameter (the iteration count) of a Loop node is the most direct way to control its effect. For instance, in a procedural noise (fBm) algorithm, increasing the loop count (adding more 'octaves') layers more detail. A single iteration might produce a blurry blob, whereas seven iterations will generate a highly detailed, complex texture resembling clouds or marble. Each iteration adds a new layer of 'high-definition detail' to the final result.
Code Examples
1let totalNoise = float(0.0);
2let frequency = float(1.0);
3let amplitude = float(0.5);
4
5// Control iteration count (octaves) with a uniform
6Loop({ end: octavesUniform }, () => {
7
8 totalNoise.addAssign( noise( uv().mul(frequency) ).mul(amplitude) );
9
10 // Update frequency and amplitude for the next iteration
11 frequency.mulAssign( 2.0 );
12 amplitude.mulAssign( 0.5 );
13
14});