@motion-core/motion-gpu 0.5.0 → 0.7.0

package/dist/core/renderer.js

@@ -5,7 +5,8 @@ import { attachShaderCompilationDiagnostics } from "./error-diagnostics.js";
 import { buildShaderSourceWithMap, formatShaderSourceLocation } from "./shader.js";
 import { buildRenderTargetSignature, resolveRenderTargetDefinitions } from "./render-targets.js";
 import { planRenderGraph } from "./render-graph.js";
-import { buildComputeShaderSource, buildPingPongComputeShaderSource, extractWorkgroupSize, storageTextureSampleScalarType } from "./compute-shader.js";
+import { buildComputeShaderSourceWithMap, buildPingPongComputeShaderSourceWithMap, extractWorkgroupSize, storageTextureSampleScalarType } from "./compute-shader.js";
+import { createComputeStorageBindGroupCache } from "./compute-bindgroup-cache.js";
 //#region src/lib/core/renderer.ts
 /**
 * Binding index for frame uniforms (`time`, `delta`, `resolution`).
@@ -74,10 +75,13 @@ async function assertCompilation(module, options) {
 		if (contextLabel.length === 0) return diagnostic.message;
 		return `[${contextLabel.join(" | ")}] ${diagnostic.message}`;
 	}).join("\n");
-	throw attachShaderCompilationDiagnostics(/* @__PURE__ */ new Error(`WGSL compilation failed:\n${summary}`), {
+	const prefix = options?.errorPrefix ?? "WGSL compilation failed";
+	throw attachShaderCompilationDiagnostics(/* @__PURE__ */ new Error(`${prefix}:\n${summary}`), {
 		kind: "shader-compilation",
+		...options?.shaderStage !== void 0 ? { shaderStage: options.shaderStage } : {},
 		diagnostics,
 		fragmentSource: options?.fragmentSource ?? "",
+		...options?.computeSource !== void 0 ? { computeSource: options.computeSource } : {},
 		includeSources: options?.includeSources ?? {},
 		...options?.defineBlockSource !== void 0 ? { defineBlockSource: options.defineBlockSource } : {},
 		materialSource: options?.materialSource ?? null,
@@ -87,6 +91,41 @@ async function assertCompilation(module, options) {
 function toSortedUniqueStrings(values) {
 	return Array.from(new Set(values)).sort((a, b) => a.localeCompare(b));
 }
+function extractGeneratedLineFromComputeError(message) {
+	const lineMatch = message.match(/\bline\s+(\d+)\b/i);
+	if (lineMatch) {
+		const parsed = Number.parseInt(lineMatch[1] ?? "", 10);
+		if (Number.isFinite(parsed) && parsed > 0) return parsed;
+	}
+	const colonMatch = message.match(/:(\d+):\d+/);
+	if (colonMatch) {
+		const parsed = Number.parseInt(colonMatch[1] ?? "", 10);
+		if (Number.isFinite(parsed) && parsed > 0) return parsed;
+	}
+	return null;
+}
+function toComputeCompilationError(input) {
+	const baseError = input.error instanceof Error ? input.error : new Error(String(input.error ?? "Unknown error"));
+	const generatedLine = extractGeneratedLineFromComputeError(baseError.message) ?? 0;
+	const sourceLocation = generatedLine > 0 ? input.lineMap[generatedLine] ?? null : null;
+	const diagnostics = [{
+		generatedLine,
+		message: baseError.message,
+		sourceLocation
+	}];
+	const contextLabel = [formatShaderSourceLocation(sourceLocation), generatedLine > 0 ? `generated WGSL line ${generatedLine}` : null].filter((value) => Boolean(value));
+	const summary = contextLabel.length > 0 ? `[${contextLabel.join(" | ")}] ${baseError.message}` : baseError.message;
+	return attachShaderCompilationDiagnostics(/* @__PURE__ */ new Error(`Compute shader compilation failed:\n${summary}`), {
+		kind: "shader-compilation",
+		shaderStage: "compute",
+		diagnostics,
+		fragmentSource: "",
+		computeSource: input.computeSource,
+		includeSources: {},
+		materialSource: null,
+		runtimeContext: input.runtimeContext
+	});
+}
 function buildPassGraphSnapshot(passes) {
 	const declaredPasses = passes ?? [];
 	let enabledPassCount = 0;
@@ -397,7 +436,8 @@ async function createRenderer(options) {
 	try {
 		const runtimeContext = buildShaderCompilationRuntimeContext(options);
 		const convertLinearToSrgb = shouldConvertLinearToSrgb(options.outputColorSpace, format);
-		const builtShader = buildShaderSourceWithMap(options.fragmentWgsl, options.uniformLayout, options.textureKeys, {
+		const fragmentTextureKeys = options.textureKeys.filter((key) => options.textureDefinitions[key]?.fragmentVisible !== false);
+		const builtShader = buildShaderSourceWithMap(options.fragmentWgsl, options.uniformLayout, fragmentTextureKeys, {
 			convertLinearToSrgb,
 			fragmentLineMap: options.fragmentLineMap,
 			...options.storageBufferKeys !== void 0 ? { storageBufferKeys: options.storageBufferKeys } : {},
@@ -417,10 +457,13 @@ async function createRenderer(options) {
 		const storageBufferDefinitions = options.storageBufferDefinitions ?? {};
 		const storageTextureKeys = options.storageTextureKeys ?? [];
 		const storageTextureKeySet = new Set(storageTextureKeys);
-		const textureBindings = options.textureKeys.map((key, index) => {
+		const fragmentTextureIndexByKey = new Map(fragmentTextureKeys.map((key, index) => [key, index]));
+		const textureBindings = options.textureKeys.map((key) => {
 			const config = normalizedTextureDefinitions[key];
 			if (!config) throw new Error(`Missing texture definition for "${key}"`);
-			const { samplerBinding, textureBinding } = getTextureBindings(index);
+			const fragmentTextureIndex = fragmentTextureIndexByKey.get(key);
+			const fragmentVisible = fragmentTextureIndex !== void 0;
+			const { samplerBinding, textureBinding } = getTextureBindings(fragmentTextureIndex ?? 0);
 			const sampler = device.createSampler({
 				magFilter: config.filter,
 				minFilter: config.filter,
@@ -438,6 +481,7 @@ async function createRenderer(options) {
 				key,
 				samplerBinding,
 				textureBinding,
+				fragmentVisible,
 				sampler,
 				fallbackTexture,
 				fallbackView,
@@ -481,7 +525,33 @@ async function createRenderer(options) {
 			}
 			return runtimeBinding;
 		});
-		const bindGroupLayout = device.createBindGroupLayout({ entries: createBindGroupLayoutEntries(textureBindings) });
+		const textureBindingByKey = new Map(textureBindings.map((binding) => [binding.key, binding]));
+		const fragmentTextureBindings = textureBindings.filter((binding) => binding.fragmentVisible);
+		const computeStorageBufferLayoutEntries = storageBufferKeys.map((key, index) => {
+			const bufferType = (storageBufferDefinitions[key]?.access ?? "read-write") === "read" ? "read-only-storage" : "storage";
+			return {
+				binding: index,
+				visibility: GPUShaderStage.COMPUTE,
+				buffer: { type: bufferType }
+			};
+		});
+		const computeStorageBufferTopologyKey = storageBufferKeys.map((key) => `${key}:${storageBufferDefinitions[key]?.access ?? "read-write"}`).join("|");
+		const computeStorageTextureLayoutEntries = storageTextureKeys.map((key, index) => {
+			const config = normalizedTextureDefinitions[key];
+			return {
+				binding: index,
+				visibility: GPUShaderStage.COMPUTE,
+				storageTexture: {
+					access: "write-only",
+					format: config?.format ?? "rgba8unorm",
+					viewDimension: "2d"
+				}
+			};
+		});
+		const computeStorageTextureTopologyKey = storageTextureKeys.map((key) => `${key}:${normalizedTextureDefinitions[key]?.format ?? "rgba8unorm"}`).join("|");
+		const computeStorageBufferBindGroupCache = createComputeStorageBindGroupCache(device);
+		const computeStorageTextureBindGroupCache = createComputeStorageBindGroupCache(device);
+		const bindGroupLayout = device.createBindGroupLayout({ entries: createBindGroupLayoutEntries(fragmentTextureBindings) });
 		const fragmentStorageBindGroupLayout = storageBufferKeys.length > 0 ? device.createBindGroupLayout({ entries: storageBufferKeys.map((_, index) => ({
 			binding: index,
 			visibility: GPUShaderStage.FRAGMENT,
@@ -625,7 +695,9 @@ async function createRenderer(options) {
 				viewA: textureA.createView(),
 				textureB,
 				viewB: textureB.createView(),
-				bindGroupLayout
+				bindGroupLayout,
+				readAWriteBBindGroup: null,
+				readBWriteABindGroup: null
 			};
 			pingPongTexturePairs.set(target, pair);
 			return pair;
@@ -652,14 +724,14 @@ async function createRenderer(options) {
 				if (texDef?.format) storageTextureDefs[key] = { format: texDef.format };
 			}
 			const isPingPongPipeline = Boolean(buildOptions.pingPongTarget && buildOptions.pingPongFormat);
-			const shaderCode = isPingPongPipeline ? buildPingPongComputeShaderSource({
+			const builtComputeShader = isPingPongPipeline ? buildPingPongComputeShaderSourceWithMap({
 				compute: buildOptions.computeSource,
 				uniformLayout: options.uniformLayout,
 				storageBufferKeys,
 				storageBufferDefinitions: storageBufferDefs,
 				target: buildOptions.pingPongTarget,
 				targetFormat: buildOptions.pingPongFormat
-			}) : buildComputeShaderSource({
+			}) : buildComputeShaderSourceWithMap({
 				compute: buildOptions.computeSource,
 				uniformLayout: options.uniformLayout,
 				storageBufferKeys,
@@ -667,7 +739,7 @@ async function createRenderer(options) {
 				storageTextureKeys,
 				storageTextureDefinitions: storageTextureDefs
 			});
-			const computeShaderModule = device.createShaderModule({ code: shaderCode });
+			const computeShaderModule = device.createShaderModule({ code: builtComputeShader.code });
 			const workgroupSize = extractWorkgroupSize(buildOptions.computeSource);
 			const computeUniformBGL = device.createBindGroupLayout({ entries: [{
 				binding: FRAME_BINDING,
@@ -681,15 +753,7 @@ async function createRenderer(options) {
 				visibility: GPUShaderStage.COMPUTE,
 				buffer: { type: "uniform" }
 			}] });
-			const storageBGLEntries = storageBufferKeys.map((key, index) => {
-				const bufferType = (storageBufferDefinitions[key]?.access ?? "read-write") === "read" ? "read-only-storage" : "storage";
-				return {
-					binding: index,
-					visibility: GPUShaderStage.COMPUTE,
-					buffer: { type: bufferType }
-				};
-			});
-			const storageBGL = storageBGLEntries.length > 0 ? device.createBindGroupLayout({ entries: storageBGLEntries }) : null;
+			const storageBGL = computeStorageBufferLayoutEntries.length > 0 ? device.createBindGroupLayout({ entries: computeStorageBufferLayoutEntries }) : null;
 			const storageTextureBGLEntries = isPingPongPipeline ? [{
 				binding: 0,
 				visibility: GPUShaderStage.COMPUTE,
@@ -706,41 +770,42 @@ async function createRenderer(options) {
 					format: buildOptions.pingPongFormat,
 					viewDimension: "2d"
 				}
-			}] : storageTextureKeys.map((key, index) => {
-				const texDef = options.textureDefinitions[key];
-				return {
-					binding: index,
-					visibility: GPUShaderStage.COMPUTE,
-					storageTexture: {
-						access: "write-only",
-						format: texDef?.format ?? "rgba8unorm",
-						viewDimension: "2d"
-					}
-				};
-			});
+			}] : computeStorageTextureLayoutEntries;
 			const storageTextureBGL = storageTextureBGLEntries.length > 0 ? device.createBindGroupLayout({ entries: storageTextureBGLEntries }) : null;
 			const bindGroupLayouts = [computeUniformBGL];
 			if (storageBGL || storageTextureBGL) bindGroupLayouts.push(storageBGL ?? device.createBindGroupLayout({ entries: [] }));
 			if (storageTextureBGL) bindGroupLayouts.push(storageTextureBGL);
 			const computePipelineLayout = device.createPipelineLayout({ bindGroupLayouts });
-			const entry = {
-				pipeline: device.createComputePipeline({
+			let pipeline;
+			try {
+				pipeline = device.createComputePipeline({
 					layout: computePipelineLayout,
 					compute: {
 						module: computeShaderModule,
 						entryPoint: "compute"
 					}
-				}),
-				bindGroup: device.createBindGroup({
-					layout: computeUniformBGL,
-					entries: [{
-						binding: FRAME_BINDING,
-						resource: { buffer: frameBuffer }
-					}, {
-						binding: UNIFORM_BINDING,
-						resource: { buffer: uniformBuffer }
-					}]
-				}),
+				});
+			} catch (error) {
+				throw toComputeCompilationError({
+					error,
+					lineMap: builtComputeShader.lineMap,
+					computeSource: buildOptions.computeSource,
+					runtimeContext
+				});
+			}
+			const computeUniformBindGroup = device.createBindGroup({
+				layout: computeUniformBGL,
+				entries: [{
+					binding: FRAME_BINDING,
+					resource: { buffer: frameBuffer }
+				}, {
+					binding: UNIFORM_BINDING,
+					resource: { buffer: uniformBuffer }
+				}]
+			});
+			const entry = {
+				pipeline,
+				bindGroup: computeUniformBindGroup,
 				workgroupSize,
 				computeSource: buildOptions.computeSource
 			};
@@ -748,71 +813,71 @@ async function createRenderer(options) {
 			return entry;
 		};
 		const getComputeStorageBindGroup = () => {
-			if (storageBufferKeys.length === 0) return null;
-			const storageBGLEntries = storageBufferKeys.map((key, index) => {
-				const bufferType = (storageBufferDefinitions[key]?.access ?? "read-write") === "read" ? "read-only-storage" : "storage";
-				return {
-					binding: index,
-					visibility: GPUShaderStage.COMPUTE,
-					buffer: { type: bufferType }
-				};
-			});
-			const storageBGL = device.createBindGroupLayout({ entries: storageBGLEntries });
-			const storageEntries = storageBufferKeys.map((key, index) => {
+			if (computeStorageBufferLayoutEntries.length === 0) return null;
+			const resources = storageBufferKeys.map((key) => {
 				const buffer = storageBufferMap.get(key);
 				if (!buffer) throw new Error(`Storage buffer "${key}" not allocated.`);
+				return buffer;
+			});
+			const storageEntries = resources.map((buffer, index) => {
 				return {
 					binding: index,
 					resource: { buffer }
 				};
 			});
-			return device.createBindGroup({
-				layout: storageBGL,
-				entries: storageEntries
+			return computeStorageBufferBindGroupCache.getOrCreate({
+				topologyKey: computeStorageBufferTopologyKey,
+				layoutEntries: computeStorageBufferLayoutEntries,
+				bindGroupEntries: storageEntries,
+				resourceRefs: resources
 			});
 		};
 		const getComputeStorageTextureBindGroup = () => {
-			if (storageTextureKeys.length === 0) return null;
-			const entries = storageTextureKeys.map((key, index) => {
-				const texDef = options.textureDefinitions[key];
-				return {
-					binding: index,
-					visibility: GPUShaderStage.COMPUTE,
-					storageTexture: {
-						access: "write-only",
-						format: texDef?.format ?? "rgba8unorm",
-						viewDimension: "2d"
-					}
-				};
-			});
-			const bgl = device.createBindGroupLayout({ entries });
-			const bgEntries = storageTextureKeys.map((key, index) => {
-				const binding = textureBindings.find((b) => b.key === key);
+			if (computeStorageTextureLayoutEntries.length === 0) return null;
+			const resources = storageTextureKeys.map((key) => {
+				const binding = textureBindingByKey.get(key);
 				if (!binding || !binding.texture) throw new Error(`Storage texture "${key}" not allocated.`);
+				return binding.view;
+			});
+			const bgEntries = resources.map((view, index) => {
 				return {
 					binding: index,
-					resource: binding.view
+					resource: view
 				};
 			});
-			return device.createBindGroup({
-				layout: bgl,
-				entries: bgEntries
+			return computeStorageTextureBindGroupCache.getOrCreate({
+				topologyKey: computeStorageTextureTopologyKey,
+				layoutEntries: computeStorageTextureLayoutEntries,
+				bindGroupEntries: bgEntries,
+				resourceRefs: resources
 			});
 		};
 		const getPingPongStorageTextureBindGroup = (target, readFromA) => {
 			const pair = ensurePingPongTexturePair(target);
-			const readView = readFromA ? pair.viewA : pair.viewB;
-			const writeView = readFromA ? pair.viewB : pair.viewA;
-			return device.createBindGroup({
+			if (readFromA) {
+				if (!pair.readAWriteBBindGroup) pair.readAWriteBBindGroup = device.createBindGroup({
+					layout: pair.bindGroupLayout,
+					entries: [{
+						binding: 0,
+						resource: pair.viewA
+					}, {
+						binding: 1,
+						resource: pair.viewB
+					}]
+				});
+				return pair.readAWriteBBindGroup;
+			}
+			if (!pair.readBWriteABindGroup) pair.readBWriteABindGroup = device.createBindGroup({
 				layout: pair.bindGroupLayout,
 				entries: [{
 					binding: 0,
-					resource: readView
+					resource: pair.viewB
 				}, {
 					binding: 1,
-					resource: writeView
+					resource: pair.viewA
 				}]
 			});
+			return pair.readBWriteABindGroup;
 		};
 		const frameBuffer = device.createBuffer({
 			size: 16,
@@ -843,7 +908,7 @@ async function createRenderer(options) {
 				binding: UNIFORM_BINDING,
 				resource: { buffer: uniformBuffer }
 			}];
-			for (const binding of textureBindings) {
+			for (const binding of fragmentTextureBindings) {
 				entries.push({
 					binding: binding.samplerBinding,
 					resource: binding.sampler
@@ -1211,7 +1276,7 @@ async function createRenderer(options) {
 			let bindGroupDirty = false;
 			for (const binding of textureBindings) {
 				if (storageTextureKeySet.has(binding.key)) continue;
-				if (updateTextureBinding(binding, textures[binding.key] ?? normalizedTextureDefinitions[binding.key]?.source ?? null, renderMode)) bindGroupDirty = true;
+				if (updateTextureBinding(binding, textures[binding.key] ?? normalizedTextureDefinitions[binding.key]?.source ?? null, renderMode) && binding.fragmentVisible) bindGroupDirty = true;
 			}
 			if (bindGroupDirty) bindGroup = createBindGroup();
 			if (pendingStorageWrites) for (const write of pendingStorageWrites) {