shaders 2.5.94 → 2.5.96

package/dist/core/index.js

@@ -8,107 +8,108 @@ import { t as createAnimatedTime } from "./time-DUqSFWvT.js";
 import "./Aurora-BPHeGEZ_.js";
 import "./Beam-CAnoOWgt.js";
 import "./Blob-CuRSRXmA.js";
-import "./Blur-DTyNQt1R.js";
-import "./BrightnessContrast-BoR9bi58.js";
-import "./Bulge-DN2R75Hp.js";
-import "./ChannelBlur-CCaPXjka.js";
-import "./Checkerboard-_IUtUrDv.js";
-import "./ChromaFlow-Cq6hDVjX.js";
-import "./ChromaticAberration-G8_bwQtD.js";
-import "./Circle--0oHzoCi.js";
-import "./ConcentricSpin-BzxzMieZ.js";
-import "./ConicGradient-BXXizzIs.js";
-import "./ContourLines-C0XSJEkE.js";
-import "./sdf-Bux00UoZ.js";
-import "./Crescent-DPxGWdPH.js";
-import "./Cross-CDyzf8TT.js";
-import "./CRTScreen-DolQEkb1.js";
-import "./Crystal-DSuN8TNY.js";
-import "./CursorRipples-Bo-3LZoC.js";
-import "./CursorTrail-C-0lpOV1.js";
-import "./DiamondGradient-TsOxHjg_.js";
-import "./DiffuseBlur-BqIV4JLM.js";
-import "./Dither-D_YF6z03.js";
-import "./DOMTexture-Dw3Qakny.js";
-import "./DotGrid-CiDt4NmI.js";
-import "./DropShadow-BRoXryDA.js";
-import "./Duotone-CGHcHB9f.js";
-import "./Ellipse-BNmzdnpK.js";
-import "./Emboss-nrduRrVs.js";
-import "./FallingLines-vdw8KxhV.js";
-import "./FilmGrain-BqQeKO6Z.js";
-import "./FloatingParticles-DR5cv6Eh.js";
-import "./Flower-B4xPp0Qa.js";
-import "./FlowField-DpP32B1X.js";
-import "./FlowingGradient-lSouJxmq.js";
-import "./Form3D-DQD-0zrd.js";
-import "./Glass-CRfTkmRy.js";
-import "./GlassTiles-B7aAvcTQ.js";
-import "./Glitch-CgmgjLea.js";
-import "./Glow-CKWIRcBt.js";
-import "./Godrays-o-3Im6H1.js";
-import "./Grayscale-Bip62olI.js";
-import "./Grid-hwQnF_hs.js";
-import "./GridDistortion-DXM5MgSc.js";
-import "./Group-BexPm4Fb.js";
-import "./Halftone-onLYU4dF.js";
-import "./HexGrid-BkqEEgfh.js";
-import "./HueShift-BldS-av9.js";
-import "./ImageTexture-DLCjc5cM.js";
-import "./Invert-C2LI5GXr.js";
-import "./Kaleidoscope-CxWjs5jx.js";
-import "./LensFlare-BNO7tCXH.js";
-import "./LinearBlur-Ds6rm8u-.js";
-import "./LinearGradient-BZjDhnZp.js";
-import "./Liquify-CqcAWBwZ.js";
-import "./Mirror-5W3sul9v.js";
-import "./MultiPointGradient-lpUGnrLq.js";
-import "./Neon-CUKnkAK8.js";
-import "./Paper-14yYPnWW.js";
-import "./Perspective-POVbIGPc.js";
-import "./Pixelate-CxUxBDeN.js";
-import "./Plasma-DM9TU0VN.js";
-import "./PolarCoordinates-t4Wa00gQ.js";
-import "./Polygon-C1y6Nyh4.js";
-import "./Posterize-Dk4DE8Ee.js";
-import "./ProgressiveBlur-BcHBSVDo.js";
-import "./RadialGradient-CSXQIa5L.js";
-import "./RectangularCoordinates-YaZ_uRXb.js";
-import "./Ring-Chj1tp_P.js";
-import "./Ripples-wJx2FwJY.js";
-import "./RoundedRect-BEj6tE1e.js";
-import "./Saturation-B500nPZH.js";
-import "./Sharpness-NqY4_gKZ.js";
-import "./Shatter-CZMOHj60.js";
-import "./SimplexNoise-2-J7EbY9.js";
-import "./SineWave-OWJVWsI1.js";
-import "./Solarize-CEhQxL9Z.js";
-import "./SolidColor-Dlzm61ZG.js";
-import "./Spherize-CXf4_Mkm.js";
-import "./Spiral-CSXNX92f.js";
-import "./Star-fPw1j10r.js";
-import "./Strands-BPVy1zbt.js";
-import "./Stretch-CFAjfvny.js";
-import "./Stripes-BSGzno-I.js";
-import "./StudioBackground-81AihXcZ.js";
-import "./Swirl-D_ZvZtDS.js";
-import "./TiltShift-BysRsV8v.js";
-import "./Tint-C6xN-Qot.js";
-import "./Trapezoid-Cr61vRvN.js";
-import "./Tritone-Dk8GcpYo.js";
-import "./Truchet-BFd2XYD3.js";
-import "./Twirl-CA0r8U7e.js";
-import "./Vesica-AXTA8DJU.js";
-import "./Vibrance-Dq1jBFJb.js";
-import "./browser-DIoaEnIX.js";
-import "./VideoTexture-BobyGZGr.js";
-import "./Vignette-DB8x78Up.js";
-import "./Voronoi-ALXxxHBo.js";
-import "./WaveDistortion-CHb75HO3.js";
-import "./Weave-j4CrCig4.js";
-import "./WebcamTexture-BXj7sqND.js";
-import "./ZoomBlur-Cl75kL8E.js";
-import { t as getAllShaders } from "./shaderRegistry-BzOzMO4V.js";
+import "./computeBlur-C3oX720H.js";
+import "./Blur-CXXttTb1.js";
+import "./BrightnessContrast-CJTOpQCn.js";
+import "./Bulge-Chpbxxzj.js";
+import "./ChannelBlur-gzP71FWd.js";
+import "./Checkerboard-ucave4-a.js";
+import "./ChromaFlow-BZXyVHtK.js";
+import "./ChromaticAberration-DsMj-vBw.js";
+import "./Circle-QgCuVo44.js";
+import "./ConcentricSpin-Crfxti93.js";
+import "./ConicGradient-CQAPYlQg.js";
+import "./ContourLines-KTHC32hd.js";
+import "./sdf-DyC2H_qS.js";
+import "./Crescent-BkRt-XWy.js";
+import "./Cross-kkY7feuC.js";
+import "./CRTScreen-CTwXU-NX.js";
+import "./Crystal-xVyUhVD-.js";
+import "./CursorRipples-Cgm7N0Bp.js";
+import "./CursorTrail-CCRbdwHJ.js";
+import "./DiamondGradient-BC3ugP8a.js";
+import "./DiffuseBlur-eyM1v3ad.js";
+import "./Dither-CDfDotR6.js";
+import "./DOMTexture-D-RkeyMs.js";
+import "./DotGrid-T9YbgC3V.js";
+import "./DropShadow-jMhnYPXZ.js";
+import "./Duotone-Bl02WcA2.js";
+import "./Ellipse-CXxGqTYI.js";
+import "./Emboss-ClQV27Mt.js";
+import "./FallingLines-CArEXajJ.js";
+import "./FilmGrain-Ph73aoC_.js";
+import "./FloatingParticles-BtwGRl_d.js";
+import "./Flower-MAwlZEv8.js";
+import "./FlowField-RyqiRxyI.js";
+import "./FlowingGradient-C0Zoyfd6.js";
+import "./Form3D-rKpxb9t3.js";
+import "./Glass-DDBKYclp.js";
+import "./GlassTiles-k1C4a4u8.js";
+import "./Glitch-DzPMkBu4.js";
+import "./Glow-BwaPYDRZ.js";
+import "./Godrays-DAYmq-BP.js";
+import "./Grayscale-lYKBBkGY.js";
+import "./Grid-BJ-nxN3i.js";
+import "./GridDistortion-DtaRNrTZ.js";
+import "./Group-DpozigtX.js";
+import "./Halftone-BVL2oy37.js";
+import "./HexGrid-D-EmQ4kI.js";
+import "./HueShift-D9K0ynaS.js";
+import "./ImageTexture-CArkZMfh.js";
+import "./Invert-DCnwo_Xq.js";
+import "./Kaleidoscope-BytHro3k.js";
+import "./LensFlare-B0vv4x97.js";
+import "./LinearBlur-BFewxPjV.js";
+import "./LinearGradient-BKUf_u7r.js";
+import "./Liquify-cE5dxrfh.js";
+import "./Mirror-DIle92J8.js";
+import "./MultiPointGradient-DDwac_mm.js";
+import "./Neon-Dg8UfC7P.js";
+import "./Paper-bMSMCeYK.js";
+import "./Perspective-BmfvQV6W.js";
+import "./Pixelate-Dl26r6IT.js";
+import "./Plasma-CJWS1TvX.js";
+import "./PolarCoordinates-lq6K4WBm.js";
+import "./Polygon-DRCs3CYs.js";
+import "./Posterize-BjH7Zscm.js";
+import "./ProgressiveBlur-B8xwWyTM.js";
+import "./RadialGradient-DiGFPgrn.js";
+import "./RectangularCoordinates-COkNDxi0.js";
+import "./Ring-QApyKPzE.js";
+import "./Ripples-C8Q17Hvz.js";
+import "./RoundedRect-Ca9af9xe.js";
+import "./Saturation-CgDaiq6n.js";
+import "./Sharpness-CRXT0D30.js";
+import "./Shatter-BssZTRYJ.js";
+import "./SimplexNoise-KfTCAfpL.js";
+import "./SineWave-Ckeap_YM.js";
+import "./Solarize-DhtQYYpW.js";
+import "./SolidColor-6yUkGybH.js";
+import "./Spherize-8LXrGGG_.js";
+import "./Spiral-Bs7uZrBr.js";
+import "./Star-DiXwnPGP.js";
+import "./Strands-DsAAVemq.js";
+import "./Stretch-D7P2R5lV.js";
+import "./Stripes-DF8agIiJ.js";
+import "./StudioBackground-BFeNfwEu.js";
+import "./Swirl-BwezrSAA.js";
+import "./TiltShift-CI3FlfYk.js";
+import "./Tint-BdXlqlzz.js";
+import "./Trapezoid-BX_hmeZJ.js";
+import "./Tritone-BlJ7cchN.js";
+import "./Truchet-Bnn0fwbF.js";
+import "./Twirl-C5ijhqz1.js";
+import "./Vesica-DU0f85NG.js";
+import "./Vibrance-dqIV6GBe.js";
+import "./browser-ClWxLlIB.js";
+import "./VideoTexture-DJrkry82.js";
+import "./Vignette-DB1wO1dm.js";
+import "./Voronoi-C3WIJFWc.js";
+import "./WaveDistortion-BKma8-Ju.js";
+import "./Weave-xuu_vQ5e.js";
+import "./WebcamTexture-Cf8J7JB1.js";
+import "./ZoomBlur-UcS2iFT2.js";
+import { t as getAllShaders } from "./shaderRegistry-B_84rvO8.js";
 import { Material, Mesh, MeshBasicNodeMaterial, OrthographicCamera, PlaneGeometry, SRGBColorSpace, Scene, Vector2, WebGPURenderer } from "three/webgpu";
 import { WebGLRenderer } from "three";
 import { PI, abs, add, atan, clamp, convertToTexture, cos, div, dot, float, fract, max, min, mix, mul, pow, screenUV, sign, sin, smoothstep, sqrt, step, sub, time, uniform, uv, vec2, vec3, vec4 } from "three/tsl";
@@ -809,6 +810,15 @@ function shaderRenderer() {
 						}
 					});
 				});
+				let hasComputeNodes = false;
+				for (const ni of nodeRegistry.nodes.values()) if (ni.computeGetNodes) {
+					hasComputeNodes = true;
+					break;
+				}
+				if (hasComputeNodes && materialUpdateBatchRAF === null) materialUpdateBatchRAF = requestAnimationFrame(() => {
+					materialUpdateBatchRAF = null;
+					updateMaterial();
+				});
 				lastRenderTime = 0;
 				renderFrame();
 			});
@@ -956,7 +966,8 @@ function shaderRenderer() {
 		}
 		const newProcessedMasks = new Set(processedMasks);
 		newProcessedMasks.add(currentNodeId);
-		const sampled = trackConvertToTexture(composeNodeTree(sourceNodeId, newProcessedMasks)).sample(sampleUV ?? screenUV);
+		const mapTexture = trackConvertToTexture(composeNodeTree(sourceNodeId, newProcessedMasks));
+		const sampled = mapTexture.sample(sampleUV ?? screenUV);
 		let raw;
 		switch (mapConfig.channel) {
 			case "alpha":
@@ -981,7 +992,9 @@ function shaderRenderer() {
 			inputMax: uniform(mapConfig.inputMax),
 			outputMin: uniform(mapConfig.outputMin),
 			outputMax: uniform(mapConfig.outputMax),
-			curve: uniform(mapConfig.curve ?? 0)
+			curve: uniform(mapConfig.curve ?? 0),
+			sourceTexture: mapTexture,
+			channel: mapConfig.channel
 		};
 		else {
 			nodeInfo.mapUniforms[propName].inputMin.value = mapConfig.inputMin;
@@ -989,6 +1002,8 @@ function shaderRenderer() {
 			nodeInfo.mapUniforms[propName].outputMin.value = mapConfig.outputMin;
 			nodeInfo.mapUniforms[propName].outputMax.value = mapConfig.outputMax;
 			nodeInfo.mapUniforms[propName].curve.value = mapConfig.curve ?? 0;
+			nodeInfo.mapUniforms[propName].sourceTexture = mapTexture;
+			nodeInfo.mapUniforms[propName].channel = mapConfig.channel;
 		}
 		const { inputMin: inputMinU, inputMax: inputMaxU, outputMin: outputMinU, outputMax: outputMaxU, curve: curveU } = nodeInfo.mapUniforms[propName];
 		const inputRange = max(inputMaxU.sub(inputMinU), 1e-4);
@@ -1056,7 +1071,8 @@ function shaderRenderer() {
 	const buildEffectiveUniforms = (baseUniforms, maps, nodeId, processedMasks) => {
 		if (!maps || Object.keys(maps).length === 0) return baseUniforms;
 		const effectiveUniforms = { ...baseUniforms };
-		const customSampleUVs = nodeRegistry.nodes.get(nodeId)?.mapSampleUVsFunc?.(baseUniforms) ?? {};
+		const nodeInfo = nodeRegistry.nodes.get(nodeId);
+		const customSampleUVs = nodeInfo?.mapSampleUVsFunc?.(baseUniforms) ?? {};
 		for (const [propName, driverConfig] of Object.entries(maps)) {
 			let resolvedNode = null;
 			if (driverConfig.type === "map") {
@@ -1076,10 +1092,38 @@ function shaderRenderer() {
 				if (!(propName in effectiveUniforms)) continue;
 				resolvedNode = resolveAutoAnimateForProp(driverConfig, nodeId, propName);
 			}
-			if (resolvedNode !== null && propName in effectiveUniforms) effectiveUniforms[propName] = {
-				...effectiveUniforms[propName],
-				uniform: resolvedNode
-			};
+			if (resolvedNode !== null && propName in effectiveUniforms) {
+				let mapComputeInfo = void 0;
+				if (driverConfig.type === "map") {
+					const mu = nodeInfo?.mapUniforms?.[propName];
+					if (mu?.sourceTexture && mu?.channel) mapComputeInfo = {
+						sourceTexture: mu.sourceTexture,
+						channel: mu.channel,
+						inputMin: mu.inputMin,
+						inputMax: mu.inputMax,
+						outputMin: mu.outputMin,
+						outputMax: mu.outputMax,
+						curve: mu.curve
+					};
+				}
+				let getCpuValue = void 0;
+				if (driverConfig.type === "mouse") getCpuValue = () => {
+					const state = nodeInfo?.mouseDriverState?.[propName];
+					const mu = nodeInfo?.mapUniforms?.[propName];
+					if (!state || !mu) return 0;
+					const smooth = state.smoothedUniform.value;
+					const oMin = mu.outputMin.value;
+					const oMax = mu.outputMax.value;
+					const exp$1 = Math.pow(2, -(mu.curve.value * 2));
+					return oMin + (oMax - oMin) * Math.pow(smooth, exp$1);
+				};
+				effectiveUniforms[propName] = {
+					...effectiveUniforms[propName],
+					uniform: resolvedNode,
+					...mapComputeInfo ? { mapComputeInfo } : {},
+					...getCpuValue ? { getCpuValue } : {}
+				};
+			}
 		}
 		return effectiveUniforms;
 	};
@@ -1089,6 +1133,20 @@ function shaderRenderer() {
 		const transformedUV = applyUVTransform(screenUV, nodeInfo.transformUniforms.offsetX, nodeInfo.transformUniforms.offsetY, nodeInfo.transformUniforms.rotation, nodeInfo.transformUniforms.scale, nodeInfo.transformUniforms.anchorX, nodeInfo.transformUniforms.anchorY, nodeInfo.transformUniforms.aspectRatio);
 		return applyEdgeHandling(transformedUV, texture$1.sample(transformedUV), texture$1, nodeInfo.transformUniforms.edges.value);
 	};
+	const initNodeCompute = (nodeInfo, params) => {
+		nodeInfo.computeOutputs = void 0;
+		nodeInfo.computeGetNodes = void 0;
+		if (nodeInfo.computeNodeFunc && renderer.backend?.isWebGPUBackend === true) try {
+			const result = nodeInfo.computeNodeFunc(params);
+			if (result) {
+				nodeInfo.computeOutputs = result.outputs;
+				nodeInfo.computeGetNodes = result.getComputeNodes;
+				return result.outputs;
+			}
+		} catch (e) {
+			console.error(`Error initializing compute for node ${nodeInfo.id}:`, e);
+		}
+	};
 	const composeNodeTree = (nodeId, processedMasks = /* @__PURE__ */ new Set(), currentlyComposedNodes) => {
 		if (currentWidth === 0 || currentHeight === 0) return vec4(0, 0, 0, 0);
 		const nodeInfo = nodeRegistry.nodes.get(nodeId);
@@ -1118,9 +1176,8 @@ function shaderRenderer() {
 			nodeInfo.beforeRenderCallbacks = [];
 			nodeInfo.afterRenderCallbacks = [];
 			nodeInfo.resizeCallbacks = [];
-			const effectiveUniforms0 = buildEffectiveUniforms(nodeInfo.uniforms ?? {}, nodeInfo.metadata.maps, nodeId, processedMasks);
-			return applyMaskIfNeeded(applyNodeTransformation(nodeInfo.fragmentNodeFunc({
-				uniforms: effectiveUniforms0,
+			const baseParams0 = {
+				uniforms: buildEffectiveUniforms(nodeInfo.uniforms ?? {}, nodeInfo.metadata.maps, nodeId, processedMasks),
 				childNode: void 0,
 				onCleanup: nodeSpecificOnCleanup,
 				onBeforeRender: nodeSpecificOnBeforeRender,
@@ -1133,7 +1190,9 @@ function shaderRenderer() {
 				},
 				renderer,
 				domCanvas: nodeInfo.domCanvas
-			}), nodeInfo), nodeInfo, nodeId, processedMasks);
+			};
+			baseParams0.computeOutputs = initNodeCompute(nodeInfo, baseParams0);
+			return applyMaskIfNeeded(applyNodeTransformation(nodeInfo.fragmentNodeFunc(baseParams0), nodeInfo), nodeInfo, nodeId, processedMasks);
 		} else {
 			const sortedChildren = [...childNodes].sort((a, b) => a.metadata.renderOrder - b.metadata.renderOrder);
 			if (nodeInfo.parentId === null) {
@@ -1179,9 +1238,8 @@ function shaderRenderer() {
 						childInfo.beforeRenderCallbacks = [];
 						childInfo.afterRenderCallbacks = [];
 						childInfo.resizeCallbacks = [];
-						const effectiveUniforms1 = buildEffectiveUniforms(childInfo.uniforms ?? {}, childInfo.metadata.maps, childInfo.id, processedMasks);
-						childResult = applyMaskIfNeeded(applyNodeTransformation(childInfo.fragmentNodeFunc({
-							uniforms: effectiveUniforms1,
+						const baseParams1 = {
+							uniforms: buildEffectiveUniforms(childInfo.uniforms ?? {}, childInfo.metadata.maps, childInfo.id, processedMasks),
 							childNode: effectiveChildNode,
 							onCleanup: childSpecificOnCleanup,
 							onBeforeRender: childSpecificOnBeforeRender,
@@ -1194,7 +1252,9 @@ function shaderRenderer() {
 							},
 							renderer,
 							domCanvas: childInfo.domCanvas
-						}), childInfo), childInfo, childInfo.id, processedMasks);
+						};
+						baseParams1.computeOutputs = initNodeCompute(childInfo, baseParams1);
+						childResult = applyMaskIfNeeded(applyNodeTransformation(childInfo.fragmentNodeFunc(baseParams1), childInfo), childInfo, childInfo.id, processedMasks);
 					}
 					if (childInfo.requiresChild && childInfo.metadata.blendMode === "normal" && !childHasChildren) composedChildren = mix(composedChildren || vec4(0, 0, 0, 0), childResult, childInfo.opacityUniform);
 					else if (composedChildren === void 0) if (nodeInfo.requiresRTT || effectiveOpacity !== 1) composedChildren = applyBlendMode(vec4(1, 1, 1, 0), childResult, childInfo.metadata.blendMode, childInfo.opacityUniform);
@@ -1212,9 +1272,8 @@ function shaderRenderer() {
 				nodeInfo.beforeRenderCallbacks = [];
 				nodeInfo.afterRenderCallbacks = [];
 				nodeInfo.resizeCallbacks = [];
-				const effectiveUniforms2 = buildEffectiveUniforms(nodeInfo.uniforms ?? {}, nodeInfo.metadata.maps, nodeId, processedMasks);
-				return applyMaskIfNeeded(applyNodeTransformation(nodeInfo.fragmentNodeFunc({
-					uniforms: effectiveUniforms2,
+				const baseParams2 = {
+					uniforms: buildEffectiveUniforms(nodeInfo.uniforms ?? {}, nodeInfo.metadata.maps, nodeId, processedMasks),
 					childNode: composedChildren,
 					onCleanup: nodeSpecificOnCleanup,
 					onBeforeRender: nodeSpecificOnBeforeRender,
@@ -1227,7 +1286,9 @@ function shaderRenderer() {
 					},
 					renderer,
 					domCanvas: nodeInfo.domCanvas
-				}), nodeInfo), nodeInfo, nodeId, processedMasks);
+				};
+				baseParams2.computeOutputs = initNodeCompute(nodeInfo, baseParams2);
+				return applyMaskIfNeeded(applyNodeTransformation(nodeInfo.fragmentNodeFunc(baseParams2), nodeInfo), nodeInfo, nodeId, processedMasks);
 			} else {
 				let composedChildrenResult = void 0;
 				for (let i = 0; i < sortedChildren.length; i++) {
@@ -1264,9 +1325,8 @@ function shaderRenderer() {
 						childInfo.beforeRenderCallbacks = [];
 						childInfo.afterRenderCallbacks = [];
 						childInfo.resizeCallbacks = [];
-						const effectiveUniforms3 = buildEffectiveUniforms(childInfo.uniforms ?? {}, childInfo.metadata.maps, childInfo.id, processedMasks);
-						childResult = applyMaskIfNeeded(applyNodeTransformation(childInfo.fragmentNodeFunc({
-							uniforms: effectiveUniforms3,
+						const baseParams3 = {
+							uniforms: buildEffectiveUniforms(childInfo.uniforms ?? {}, childInfo.metadata.maps, childInfo.id, processedMasks),
 							childNode: effectiveChildNode,
 							onCleanup: childSpecificOnCleanup,
 							onBeforeRender: childSpecificOnBeforeRender,
@@ -1279,7 +1339,9 @@ function shaderRenderer() {
 							},
 							renderer,
 							domCanvas: childInfo.domCanvas
-						}), childInfo), childInfo, childInfo.id, processedMasks);
+						};
+						baseParams3.computeOutputs = initNodeCompute(childInfo, baseParams3);
+						childResult = applyMaskIfNeeded(applyNodeTransformation(childInfo.fragmentNodeFunc(baseParams3), childInfo), childInfo, childInfo.id, processedMasks);
 					}
 					if (childInfo.requiresChild && childInfo.metadata.blendMode === "normal" && !childHasChildren) composedChildrenResult = mix(composedChildrenResult || vec4(0, 0, 0, 0), childResult, childInfo.opacityUniform);
 					else if (composedChildrenResult === void 0) if (nodeInfo.requiresRTT || effectiveOpacity !== 1) composedChildrenResult = applyBlendMode(vec4(1, 1, 1, 0), childResult, childInfo.metadata.blendMode, childInfo.opacityUniform);
@@ -1297,9 +1359,8 @@ function shaderRenderer() {
 				nodeInfo.beforeRenderCallbacks = [];
 				nodeInfo.afterRenderCallbacks = [];
 				nodeInfo.resizeCallbacks = [];
-				const effectiveUniforms4 = buildEffectiveUniforms(nodeInfo.uniforms ?? {}, nodeInfo.metadata.maps, nodeId, processedMasks);
-				return applyMaskIfNeeded(applyNodeTransformation(nodeInfo.fragmentNodeFunc({
-					uniforms: effectiveUniforms4,
+				const baseParams4 = {
+					uniforms: buildEffectiveUniforms(nodeInfo.uniforms ?? {}, nodeInfo.metadata.maps, nodeId, processedMasks),
 					childNode: composedChildrenResult,
 					onCleanup: nodeSpecificOnCleanup,
 					onBeforeRender: nodeSpecificOnBeforeRender,
@@ -1312,7 +1373,9 @@ function shaderRenderer() {
 					},
 					renderer,
 					domCanvas: nodeInfo.domCanvas
-				}), nodeInfo), nodeInfo, nodeId, processedMasks);
+				};
+				baseParams4.computeOutputs = initNodeCompute(nodeInfo, baseParams4);
+				return applyMaskIfNeeded(applyNodeTransformation(nodeInfo.fragmentNodeFunc(baseParams4), nodeInfo), nodeInfo, nodeId, processedMasks);
 			}
 		}
 	};
@@ -1402,6 +1465,7 @@ function shaderRenderer() {
 			transformUniforms,
 			transformRTTActive: false,
 			mapSampleUVsFunc: componentDefinition?.mapSampleUVs,
+			computeNodeFunc: componentDefinition?.computeNode,
 			domCanvas
 		};
 		nodeRegistry.nodes.set(id, nodeInfo);
@@ -1735,6 +1799,26 @@ function shaderRenderer() {
 			}
 		}
 	};
+	const executeComputeDispatches = (deltaTime) => {
+		const params = {
+			deltaTime,
+			pointer: {
+				x: pointerX,
+				y: pointerY
+			},
+			pointerActive,
+			dimensions: {
+				width: currentWidth,
+				height: currentHeight
+			}
+		};
+		for (const nodeInfo of nodeRegistry.nodes.values()) if (nodeInfo.computeGetNodes) try {
+			const nodes = nodeInfo.computeGetNodes(params);
+			if (nodes) for (const node of nodes) renderer.compute(node);
+		} catch (e) {
+			console.error(`Error dispatching compute for node ${nodeInfo.id}:`, e);
+		}
+	};
 	const executeBeforeRenderCallbacks = (deltaTime) => {
 		const params = {
 			deltaTime,
@@ -1804,6 +1888,7 @@ function shaderRenderer() {
 		lastRenderTime = currentTime;
 		if (enablePerformanceTracking) performance.mark("shader-cpu-start");
 		updateMouseDrivers(cappedDeltaTime);
+		executeComputeDispatches(cappedDeltaTime);
 		executeBeforeRenderCallbacks(cappedDeltaTime);
 		try {
 			if (isUpdatingMaterial) return;