@motion-core/motion-gpu
Version:
Framework-agnostic WebGPU runtime for fullscreen WGSL shaders with explicit Svelte, React, and Vue adapter entrypoints.
1,293 lines (1,290 loc) • 89.8 kB
JavaScript
import { buildComputeShaderSourceWithMap, extractWorkgroupSize } from "./compute-shader.js";
import { packUniformsIntoFast } from "./uniforms.js";
import { getTextureMipLevelCount, normalizeTextureDefinitions, resolveTextureSamplingLayout, resolveTextureSize, resolveTextureUpdateMode, toTextureData } from "./textures.js";
import { normalizeStorageBufferDefinition } from "./storage-buffers.js";
import { attachShaderCompilationDiagnostics } from "./error-diagnostics.js";
import { buildPingPongShaderSourceWithMap, buildShaderSourceWithMap, formatShaderSourceLocation } from "./shader.js";
import { attachMotionGPUErrorContext, createMotionGPUError } from "./error-report.js";
import { buildRenderTargetSignature, resolveRenderTargetDefinitions } from "./render-targets.js";
import { planRenderGraph } from "./render-graph.js";
import { createComputeBindGroupCache } from "./compute-bindgroup-cache.js";
import { createComputeExternalResolutionState, resolveComputePassResources } from "./compute-resources.js";
import { ComputeSampledFallbackTexturePool, toComputeSampledFallbackClass } from "./compute-fallback-textures.js";
import { MaterialResourceRegistry } from "./resource-registry.js";
import { buildCanvasConfiguration, buildPresentationShader, resolveColorPipeline, shouldConvertLinearToSrgb } from "./color-pipeline.js";
//#region src/lib/core/renderer.ts
/**
* Binding index for frame uniforms (`time`, `delta`, `resolution`).
*/
var FRAME_BINDING = 0;
/**
* Binding index for material uniform buffer.
*/
var UNIFORM_BINDING = 1;
/**
* First binding index used for texture sampler/texture pairs.
*/
var FIRST_TEXTURE_BINDING = 2;
var DEFAULT_MAX_COMPUTE_WORKGROUPS_PER_DIMENSION = 65535;
var COMPUTE_DISPATCH_AXES = [
"x",
"y",
"z"
];
function formatComputeDispatchValue(value) {
if (value === void 0) return "undefined";
if (typeof value === "number") return Number.isNaN(value) ? "NaN" : String(value);
if (typeof value === "string") return `"${value}"`;
try {
return JSON.stringify(value) ?? String(value);
} catch {
return String(value);
}
}
function getMaxComputeWorkgroupsPerDimension(device) {
const max = device.limits?.maxComputeWorkgroupsPerDimension;
if (typeof max === "number" && Number.isFinite(max) && max > 0) return Math.floor(max);
return DEFAULT_MAX_COMPUTE_WORKGROUPS_PER_DIMENSION;
}
function getPositiveDeviceLimit(device, name, fallback) {
const value = device.limits?.[name];
return typeof value === "number" && Number.isFinite(value) && value > 0 ? Math.floor(value) : fallback;
}
function getComputeResourceResolverLimits(device) {
return {
maxBindingsPerBindGroup: getPositiveDeviceLimit(device, "maxBindingsPerBindGroup", 1e3),
maxSampledTexturesPerShaderStage: getPositiveDeviceLimit(device, "maxSampledTexturesPerShaderStage", 16),
maxSamplersPerShaderStage: getPositiveDeviceLimit(device, "maxSamplersPerShaderStage", 16),
maxStorageTexturesPerShaderStage: getPositiveDeviceLimit(device, "maxStorageTexturesPerShaderStage", 4),
maxStorageBuffersPerShaderStage: getPositiveDeviceLimit(device, "maxStorageBuffersPerShaderStage", 8),
maxStorageBufferBindingSize: getPositiveDeviceLimit(device, "maxStorageBufferBindingSize", 134217728)
};
}
function validateComputeDispatch(dispatch, maxWorkgroupsPerDimension, label) {
if (!Array.isArray(dispatch)) throw new Error(`${label} dispatch must resolve to an array [x, y, z], got ${formatComputeDispatchValue(dispatch)}.`);
const resolved = [
dispatch[0],
dispatch[1] ?? 1,
dispatch[2] ?? 1
];
const output = [
1,
1,
1
];
for (let index = 0; index < COMPUTE_DISPATCH_AXES.length; index += 1) {
const axis = COMPUTE_DISPATCH_AXES[index];
const value = resolved[index];
if (typeof value !== "number" || !Number.isFinite(value) || !Number.isInteger(value) || value < 1) throw new Error(`${label} dispatch ${axis} must be a positive integer, got ${formatComputeDispatchValue(value)}.`);
if (value > maxWorkgroupsPerDimension) throw new Error(`${label} dispatch ${axis} must be <= device.limits.maxComputeWorkgroupsPerDimension (${maxWorkgroupsPerDimension}), got ${value}.`);
output[index] = value;
}
return output;
}
/**
* Returns sampler/texture binding slots for a texture index.
*/
function getTextureBindings(index) {
const samplerBinding = FIRST_TEXTURE_BINDING + index * 2;
return {
samplerBinding,
textureBinding: samplerBinding + 1
};
}
/**
* Resizes canvas backing store to match client size and DPR.
*/
function resizeCanvas(canvas, dprInput, cssSize) {
const dpr = Number.isFinite(dprInput) && dprInput > 0 ? dprInput : 1;
const rect = cssSize ? null : canvas.getBoundingClientRect();
const cssWidth = Math.max(0, cssSize?.width ?? rect?.width ?? 0);
const cssHeight = Math.max(0, cssSize?.height ?? rect?.height ?? 0);
const width = Math.max(1, Math.floor((cssWidth || 1) * dpr));
const height = Math.max(1, Math.floor((cssHeight || 1) * dpr));
if (canvas.width !== width || canvas.height !== height) {
canvas.width = width;
canvas.height = height;
}
return {
width,
height
};
}
/**
* Throws when a shader module contains WGSL compilation errors.
*/
async function assertCompilation(module, options) {
const errors = (await module.getCompilationInfo()).messages.filter((message) => message.type === "error");
if (errors.length === 0) return;
const diagnostics = errors.map((message) => ({
generatedLine: message.lineNum,
message: message.message,
linePos: message.linePos,
lineLength: message.length,
sourceLocation: options?.lineMap?.[message.lineNum] ?? null
}));
const summary = diagnostics.map((diagnostic) => {
const contextLabel = [formatShaderSourceLocation(diagnostic.sourceLocation), diagnostic.generatedLine > 0 ? `generated WGSL line ${diagnostic.generatedLine}` : null].filter((value) => Boolean(value));
if (contextLabel.length === 0) return diagnostic.message;
return `[${contextLabel.join(" | ")}] ${diagnostic.message}`;
}).join("\n");
const prefix = options?.errorPrefix ?? "WGSL compilation failed";
const error = /* @__PURE__ */ new Error(`${prefix}:\n${summary}`);
throw attachShaderCompilationDiagnostics(error, {
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,
...options?.runtimeContext !== void 0 ? { runtimeContext: options.runtimeContext } : {}
});
}
function toSortedUniqueStrings(values) {
return Array.from(new Set(values)).sort((a, b) => a.localeCompare(b));
}
/**
* Best-effort line extraction from a raw GPU error/exception message.
*
* Used only as a fallback when WebGPU's structured `getCompilationInfo()` and
* `popErrorScope()` channels have no per-message line metadata — primarily to
* keep test mocks that throw synchronously from `createComputePipeline()`
* reproducible against the structured-diagnostics contract.
*/
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;
}
/**
* Builds a compute compilation Error with structured diagnostics attached.
*/
function buildComputeCompilationError(input) {
const summary = input.diagnostics.map((diagnostic) => {
const contextLabel = [formatShaderSourceLocation(diagnostic.sourceLocation), diagnostic.generatedLine > 0 ? `generated WGSL line ${diagnostic.generatedLine}` : null].filter((value) => Boolean(value));
if (contextLabel.length === 0) return diagnostic.message;
return `[${contextLabel.join(" | ")}] ${diagnostic.message}`;
}).join("\n");
const error = /* @__PURE__ */ new Error(`Compute shader compilation failed:\n${summary}`);
return attachShaderCompilationDiagnostics(error, {
kind: "shader-compilation",
shaderStage: "compute",
diagnostics: input.diagnostics,
fragmentSource: "",
computeSource: input.computeSource,
includeSources: {},
materialSource: null,
runtimeContext: input.runtimeContext
});
}
/**
* Fallback compute-compilation error builder used when the synchronous
* `createShaderModule` / `createComputePipeline` path itself throws — there is
* no compilation info or popped scope to inspect, so we extract whatever line
* hint we can from the raw exception message.
*/
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;
return buildComputeCompilationError({
diagnostics: [{
generatedLine,
message: baseError.message,
sourceLocation
}],
computeSource: input.computeSource,
runtimeContext: input.runtimeContext
});
}
/**
* Awaits the async outputs of a compute shader module + pipeline creation
* sequence (compilation info + popped validation scope) and, if either reveals
* an error, returns a fully-attributed compute compilation Error. Returns
* `null` when both channels are clean.
*/
async function assertComputeCompilationAsync(input) {
let compilationMessages = [];
try {
compilationMessages = (await input.module.getCompilationInfo()).messages.filter((message) => message.type === "error");
} catch {}
const validationError = await input.validationScope.catch(() => null);
if (compilationMessages.length === 0 && !validationError) return null;
return buildComputeCompilationError({
diagnostics: compilationMessages.length > 0 ? compilationMessages.map((message) => ({
generatedLine: message.lineNum,
message: message.message,
linePos: message.linePos,
lineLength: message.length,
sourceLocation: input.lineMap[message.lineNum] ?? null
})) : [{
generatedLine: 0,
message: validationError.message,
sourceLocation: null
}],
computeSource: input.computeSource,
runtimeContext: input.runtimeContext
});
}
function buildPassGraphSnapshot(passes) {
const declaredPasses = passes ?? [];
let enabledPassCount = 0;
const inputs = [];
const outputs = [];
for (const pass of declaredPasses) {
if (pass.enabled === false) continue;
enabledPassCount += 1;
if ("isCompute" in pass && pass.isCompute === true) continue;
if ("isPingPongShader" in pass && pass.isPingPongShader === true) continue;
const rp = pass;
const needsSwap = rp.needsSwap ?? true;
const input = rp.input ?? "source";
const output = rp.output ?? (needsSwap ? "target" : "source");
inputs.push(input);
outputs.push(output);
}
return {
passCount: declaredPasses.length,
enabledPassCount,
inputs: toSortedUniqueStrings(inputs),
outputs: toSortedUniqueStrings(outputs)
};
}
function buildShaderCompilationRuntimeContext(options) {
const passList = options.getPasses?.() ?? options.passes;
const renderTargetMap = options.getRenderTargets?.() ?? options.renderTargets;
return {
...options.materialSignature ? { materialSignature: options.materialSignature } : {},
passGraph: buildPassGraphSnapshot(passList),
activeRenderTargets: Object.keys(renderTargetMap ?? {}).sort((a, b) => a.localeCompare(b))
};
}
/**
* Creates typed descriptor for `copyExternalImageToTexture`.
*/
function createExternalCopySource(source, options) {
return {
source,
...options.flipY ? { flipY: true } : {},
...options.premultipliedAlpha ? { premultipliedAlpha: true } : {}
};
}
/**
* Uploads source content to the base GPU texture level.
*/
function uploadTextureBaseLevel(device, texture, uploadOptions, source, width, height) {
device.queue.copyExternalImageToTexture(createExternalCopySource(source, {
flipY: uploadOptions.flipY,
premultipliedAlpha: uploadOptions.premultipliedAlpha
}), {
texture,
mipLevel: 0
}, {
width,
height,
depthOrArrayLayers: 1
});
}
var GPU_MIPMAP_SHADER = `
struct VertexOutput {
@builtin(position) position: vec4f,
@location(0) uv: vec2f
};
@vertex
fn vertexMain(@builtin(vertex_index) vertexIndex: u32) -> VertexOutput {
var positions = array<vec2f, 3>(
vec2f(-1.0, -3.0),
vec2f(-1.0, 1.0),
vec2f(3.0, 1.0)
);
let position = positions[vertexIndex];
var out: VertexOutput;
out.position = vec4f(position, 0.0, 1.0);
out.uv = position * vec2f(0.5, -0.5) + vec2f(0.5, 0.5);
return out;
}
@group(0) @binding(0) var mipSampler: sampler;
@group(0) @binding(1) var mipSource: texture_2d<f32>;
@fragment
fn fragmentMain(in: VertexOutput) -> @location(0) vec4f {
return textureSample(mipSource, mipSampler, in.uv);
}
`;
function createGpuMipmapGenerator(device) {
let sampler = null;
let shaderModule = null;
let bindGroupLayout = null;
let pipelineLayout = null;
const pipelineByFormat = /* @__PURE__ */ new Map();
const ensureBindGroupLayout = () => {
if (!bindGroupLayout) bindGroupLayout = device.createBindGroupLayout({ entries: [{
binding: 0,
visibility: GPUShaderStage.FRAGMENT,
sampler: { type: "filtering" }
}, {
binding: 1,
visibility: GPUShaderStage.FRAGMENT,
texture: { sampleType: "float" }
}] });
return bindGroupLayout;
};
const ensurePipeline = (format) => {
const cached = pipelineByFormat.get(format);
if (cached) return cached;
const layout = ensureBindGroupLayout();
shaderModule ??= device.createShaderModule({ code: GPU_MIPMAP_SHADER });
pipelineLayout ??= device.createPipelineLayout({ bindGroupLayouts: [layout] });
const pipeline = device.createRenderPipeline({
layout: pipelineLayout,
vertex: {
module: shaderModule,
entryPoint: "vertexMain"
},
fragment: {
module: shaderModule,
entryPoint: "fragmentMain",
targets: [{ format }]
},
primitive: { topology: "triangle-list" }
});
pipelineByFormat.set(format, pipeline);
return pipeline;
};
return { generate: ({ commandEncoder, texture, format, mipLevelCount }) => {
if (mipLevelCount <= 1) return;
sampler ??= device.createSampler({
minFilter: "linear",
magFilter: "linear"
});
const layout = ensureBindGroupLayout();
const pipeline = ensurePipeline(format);
for (let level = 1; level < mipLevelCount; level += 1) {
const sourceView = texture.createView({
baseMipLevel: level - 1,
mipLevelCount: 1
});
const targetView = texture.createView({
baseMipLevel: level,
mipLevelCount: 1
});
const bindGroup = device.createBindGroup({
layout,
entries: [{
binding: 0,
resource: sampler
}, {
binding: 1,
resource: sourceView
}]
});
const pass = commandEncoder.beginRenderPass({ colorAttachments: [{
view: targetView,
clearValue: {
r: 0,
g: 0,
b: 0,
a: 0
},
loadOp: "clear",
storeOp: "store"
}] });
pass.setPipeline(pipeline);
pass.setBindGroup(0, bindGroup);
pass.draw(3);
pass.end();
}
} };
}
function markTextureMipmapsDirty(binding, mipLevelCount) {
if (binding.generateMipmaps && mipLevelCount > 1) binding.mipmapsDirty = true;
else binding.mipmapsDirty = false;
}
/**
* Creates bind group layout entries for frame/uniform buffers plus texture bindings.
*/
function createBindGroupLayoutEntries(textureBindings) {
const entries = [{
binding: FRAME_BINDING,
visibility: GPUShaderStage.FRAGMENT,
buffer: {
type: "uniform",
minBindingSize: 16
}
}, {
binding: UNIFORM_BINDING,
visibility: GPUShaderStage.FRAGMENT,
buffer: { type: "uniform" }
}];
for (const binding of textureBindings) {
entries.push({
binding: binding.samplerBinding,
visibility: GPUShaderStage.FRAGMENT,
sampler: { type: binding.samplerType }
});
entries.push({
binding: binding.textureBinding,
visibility: GPUShaderStage.FRAGMENT,
texture: {
sampleType: binding.resource.sampleType,
viewDimension: "2d",
multisampled: false
}
});
}
return entries;
}
/**
* Maximum gap (in floats) between two dirty ranges that triggers merge.
*
* Set to 4 (16 bytes) which covers one vec4f alignment slot.
*/
var DIRTY_RANGE_MERGE_GAP = 4;
/**
* Shared empty result returned when no float values differ between snapshots.
*
* Avoids allocating a new `[]` on every clean frame (the common steady-state
* case). Callers must not mutate this reference.
*/
var EMPTY_DIRTY_RANGES = [];
/**
* Computes dirty float ranges between two uniform snapshots.
*
* Adjacent dirty ranges separated by a gap smaller than or equal to
* {@link DIRTY_RANGE_MERGE_GAP} are merged to reduce `writeBuffer` calls.
*
* Returns a shared empty array reference when the buffers are identical —
* callers must not mutate the returned array.
*/
function findDirtyFloatRanges(previous, next, mergeGapThreshold = DIRTY_RANGE_MERGE_GAP) {
let start = -1;
let rangeCount = 0;
const ranges = [];
for (let index = 0; index < next.length; index += 1) {
if (previous[index] !== next[index]) {
if (start === -1) start = index;
continue;
}
if (start !== -1) {
ranges.push({
start,
count: index - start
});
rangeCount += 1;
start = -1;
}
}
if (start !== -1) {
ranges.push({
start,
count: next.length - start
});
rangeCount += 1;
}
if (rangeCount === 0) return EMPTY_DIRTY_RANGES;
if (rangeCount <= 1) return ranges;
const merged = [ranges[0]];
for (let index = 1; index < rangeCount; index += 1) {
const prev = merged[merged.length - 1];
const curr = ranges[index];
if (curr.start - (prev.start + prev.count) <= mergeGapThreshold) prev.count = curr.start + curr.count - prev.start;
else merged.push(curr);
}
return merged;
}
/**
* Allocates a render target texture with usage flags suitable for passes/blits.
*/
function createRenderTexture(device, width, height, format) {
const texture = device.createTexture({
size: {
width,
height,
depthOrArrayLayers: 1
},
format,
usage: GPUTextureUsage.TEXTURE_BINDING | GPUTextureUsage.RENDER_ATTACHMENT | GPUTextureUsage.COPY_DST | GPUTextureUsage.COPY_SRC
});
return {
texture,
view: texture.createView(),
width,
height,
format
};
}
/**
* Destroys a render target texture if present.
*/
function destroyRenderTexture(target) {
target?.texture.destroy();
}
function toClearValue(color) {
return {
r: color[0],
g: color[1],
b: color[2],
a: color[3]
};
}
function toPremultipliedCanvasClearValue(color) {
const alpha = Math.min(Math.max(color[3], 0), 1);
return {
r: color[0] * alpha,
g: color[1] * alpha,
b: color[2] * alpha,
a: alpha
};
}
/**
* Creates the WebGPU renderer used by `FragCanvas`.
*
* @param options - Renderer creation options resolved from material/context state.
* @returns Renderer instance with `render` and `destroy`.
* @throws {Error} On WebGPU unavailability, shader compilation issues, or runtime setup failures.
*/
async function createRenderer(options) {
if (!navigator.gpu) throw new Error("WebGPU is not available in this browser");
const context = options.canvas.getContext("webgpu");
if (!context) throw new Error("Canvas does not support webgpu context");
const preferredCanvasFormat = navigator.gpu.getPreferredCanvasFormat();
const colorPipeline = resolveColorPipeline({
color: options.color,
preferredCanvasFormat
});
const workingFormat = colorPipeline.workingFormat;
const scenePipelineFormat = colorPipeline.requiresPresentationPass ? workingFormat : colorPipeline.canvasFormat;
let effectiveCanvasFormat = colorPipeline.canvasFormat;
let effectiveDynamicRange = colorPipeline.dynamicRange === "auto" ? "hdr" : colorPipeline.dynamicRange;
const adapter = await navigator.gpu.requestAdapter(options.adapterOptions);
if (!adapter) throw new Error("Unable to acquire WebGPU adapter");
const device = await adapter.requestDevice(options.deviceDescriptor);
const maxComputeWorkgroupsPerDimension = getMaxComputeWorkgroupsPerDimension(device);
let isDestroyed = false;
let deviceLostMessage = null;
const uncapturedErrorMessages = [];
const initializationCleanups = [];
let acceptInitializationCleanups = true;
const MAX_UNCAPTURED_ERROR_MESSAGES = 12;
const destroyDevice = () => {
try {
device.destroy();
} catch {}
};
const isDerivativeUncapturedMessage = (message) => {
const normalized = message.toLowerCase();
return normalized.includes("is invalid due to a previous error") || normalized.includes("too many warnings, no more warnings will be reported");
};
const consumeUncapturedErrorMessage = () => {
if (uncapturedErrorMessages.length === 0) return null;
const uniqueMessages = [];
for (const message of uncapturedErrorMessages) if (!uniqueMessages.includes(message)) uniqueMessages.push(message);
uncapturedErrorMessages.length = 0;
const primaryIndex = uniqueMessages.findIndex((message) => !isDerivativeUncapturedMessage(message));
if (primaryIndex === -1) return null;
const primaryMessage = uniqueMessages[primaryIndex];
if (!primaryMessage) return null;
const relatedMessages = uniqueMessages.filter((_, index) => index !== primaryIndex);
if (relatedMessages.length === 0) return `WebGPU uncaptured error: ${primaryMessage}`;
return [
`WebGPU uncaptured error: ${primaryMessage}`,
`Additional uncaptured WebGPU errors (${relatedMessages.length}):`,
...relatedMessages.map((message, index) => `[${index + 1}] ${message}`)
].join("\n");
};
const registerInitializationCleanup = (cleanup) => {
if (!acceptInitializationCleanups) return;
options.__onInitializationCleanupRegistered?.();
initializationCleanups.push(cleanup);
};
const runInitializationCleanups = () => {
for (let index = initializationCleanups.length - 1; index >= 0; index -= 1) try {
initializationCleanups[index]?.();
} catch {}
initializationCleanups.length = 0;
};
device.lost.then((info) => {
if (isDestroyed) return;
const reason = info.reason ? ` (${info.reason})` : "";
const details = info.message?.trim();
deviceLostMessage = details ? `WebGPU device lost: ${details}${reason}` : `WebGPU device lost${reason}`;
options.requestRender?.();
});
const handleUncapturedError = (event) => {
if (isDestroyed) return;
const trimmedMessage = (event.error instanceof Error ? event.error.message : String(event.error?.message ?? event.error)).trim();
const normalizedMessage = trimmedMessage.length > 0 ? trimmedMessage : "Unknown GPU validation error";
if (uncapturedErrorMessages[uncapturedErrorMessages.length - 1] === normalizedMessage) return;
uncapturedErrorMessages.push(normalizedMessage);
if (uncapturedErrorMessages.length > MAX_UNCAPTURED_ERROR_MESSAGES) uncapturedErrorMessages.splice(0, uncapturedErrorMessages.length - MAX_UNCAPTURED_ERROR_MESSAGES);
options.requestRender?.();
};
device.addEventListener("uncapturederror", handleUncapturedError);
try {
const runtimeContext = buildShaderCompilationRuntimeContext(options);
const convertLinearToSrgb = !colorPipeline.requiresPresentationPass && shouldConvertLinearToSrgb(colorPipeline.outputEncoding, colorPipeline.canvasFormat, "sdr");
const fragmentTextureKeys = options.textureKeys.filter((key) => options.textureDefinitions[key]?.fragmentVisible !== false);
const buildSceneShader = (premultiplyOutputAlpha) => buildShaderSourceWithMap(options.fragmentWgsl, options.uniformLayout, fragmentTextureKeys, {
convertLinearToSrgb,
premultiplyOutputAlpha,
fragmentLineMap: options.fragmentLineMap,
...options.storageBufferKeys !== void 0 ? { storageBufferKeys: options.storageBufferKeys } : {},
...options.storageBufferDefinitions !== void 0 ? { storageBufferDefinitions: options.storageBufferDefinitions } : {}
});
const builtShader = buildSceneShader(false);
const shaderModule = device.createShaderModule({ code: builtShader.code });
const assertSceneShaderCompilation = (module, builtSource) => assertCompilation(module, {
lineMap: builtSource.lineMap,
fragmentSource: options.fragmentSource,
includeSources: options.includeSources,
...options.defineBlockSource !== void 0 ? { defineBlockSource: options.defineBlockSource } : {},
materialSource: options.materialSource ?? null,
runtimeContext
});
await assertSceneShaderCompilation(shaderModule, builtShader);
const builtDirectCanvasShader = !colorPipeline.requiresPresentationPass ? buildSceneShader(true) : null;
const directCanvasShaderModule = builtDirectCanvasShader ? device.createShaderModule({ code: builtDirectCanvasShader.code }) : null;
if (directCanvasShaderModule && builtDirectCanvasShader) await assertSceneShaderCompilation(directCanvasShaderModule, builtDirectCanvasShader);
const normalizedTextureDefinitions = normalizeTextureDefinitions(options.textureDefinitions, options.textureKeys);
const storageBufferKeys = options.storageBufferKeys ?? [];
const storageBufferDefinitions = options.storageBufferDefinitions ?? {};
const storageTextureKeys = options.storageTextureKeys ?? [];
const storageTextureKeySet = new Set(storageTextureKeys);
const resourceRegistry = new MaterialResourceRegistry();
const sampledFallbackPool = new ComputeSampledFallbackTexturePool(device);
registerInitializationCleanup(() => sampledFallbackPool.destroy());
const sampledFallbackUsage = GPUTextureUsage.TEXTURE_BINDING | GPUTextureUsage.COPY_DST;
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 fragmentTextureIndex = fragmentTextureIndexByKey.get(key);
const fragmentVisible = fragmentTextureIndex !== void 0;
const { samplerBinding, textureBinding } = getTextureBindings(fragmentTextureIndex ?? 0);
const samplingLayout = resolveTextureSamplingLayout({
format: config.format,
filter: config.filter,
deviceFeatures: device.features
});
if (config.generateMipmaps && samplingLayout.sampleType !== "float") throw new Error(`Texture "${key}" with format "${config.format}" cannot generate mipmaps because it is not filterable on this device.`);
const sampler = device.createSampler({
magFilter: samplingLayout.effectiveFilter,
minFilter: samplingLayout.effectiveFilter,
mipmapFilter: config.generateMipmaps ? samplingLayout.effectiveFilter : "nearest",
addressModeU: config.addressModeU,
addressModeV: config.addressModeV,
maxAnisotropy: samplingLayout.samplerType === "filtering" && samplingLayout.effectiveFilter === "linear" ? config.anisotropy : 1
});
let fallbackView;
let resource;
if (config.storage) {
if (!config.width || !config.height) throw new Error(`Storage texture "${key}" requires explicit positive width and height.`);
const storageUsage = GPUTextureUsage.TEXTURE_BINDING | GPUTextureUsage.STORAGE_BINDING | GPUTextureUsage.COPY_DST;
const storageTexture = device.createTexture({
size: {
width: config.width,
height: config.height,
depthOrArrayLayers: 1
},
format: config.format,
usage: storageUsage
});
registerInitializationCleanup(() => storageTexture.destroy());
fallbackView = storageTexture.createView();
resource = resourceRegistry.registerTexture({
logicalId: key,
ownedTexture: storageTexture,
storageView: fallbackView,
sampledView: fallbackView,
format: config.format,
width: config.width,
height: config.height,
mipLevelCount: 1,
sampleType: samplingLayout.sampleType,
usage: storageUsage
});
} else {
fallbackView = sampledFallbackPool.get(toComputeSampledFallbackClass(samplingLayout.sampleType)).view;
resource = resourceRegistry.registerTexture({
logicalId: key,
sampledView: fallbackView,
format: config.format,
mipLevelCount: 1,
sampleType: samplingLayout.sampleType,
usage: sampledFallbackUsage
});
}
const runtimeBinding = {
key,
resource,
samplerBinding,
textureBinding,
fragmentVisible,
sampler,
fallbackView,
source: null,
samplerType: samplingLayout.samplerType,
effectiveFilter: samplingLayout.effectiveFilter,
colorSpace: config.colorSpace,
defaultColorSpace: config.colorSpace,
flipY: config.flipY,
defaultFlipY: config.flipY,
generateMipmaps: config.generateMipmaps,
defaultGenerateMipmaps: config.generateMipmaps,
premultipliedAlpha: config.premultipliedAlpha,
defaultPremultipliedAlpha: config.premultipliedAlpha,
update: config.update ?? "once",
lastToken: null,
mipmapsDirty: false,
feedbackViewActive: false
};
if (config.update !== void 0) runtimeBinding.defaultUpdate = config.update;
return runtimeBinding;
});
const textureBindingByKey = new Map(textureBindings.map((binding) => [binding.key, binding]));
const fragmentTextureBindings = textureBindings.filter((binding) => binding.fragmentVisible);
const bindGroupLayout = device.createBindGroupLayout({ entries: createBindGroupLayoutEntries(fragmentTextureBindings) });
const fragmentStorageBindGroupLayout = storageBufferKeys.length > 0 ? device.createBindGroupLayout({ entries: storageBufferKeys.map((_, index) => ({
binding: index,
visibility: GPUShaderStage.FRAGMENT,
buffer: { type: "read-only-storage" }
})) }) : null;
const pipelineLayout = device.createPipelineLayout({ bindGroupLayouts: fragmentStorageBindGroupLayout ? [bindGroupLayout, fragmentStorageBindGroupLayout] : [bindGroupLayout] });
const pipeline = device.createRenderPipeline({
layout: pipelineLayout,
vertex: {
module: shaderModule,
entryPoint: "motiongpuVertex"
},
fragment: {
module: shaderModule,
entryPoint: "motiongpuFragmentMain",
targets: [{ format: scenePipelineFormat }]
},
primitive: { topology: "triangle-list" }
});
const directCanvasPipeline = directCanvasShaderModule ? device.createRenderPipeline({
layout: pipelineLayout,
vertex: {
module: directCanvasShaderModule,
entryPoint: "motiongpuVertex"
},
fragment: {
module: directCanvasShaderModule,
entryPoint: "motiongpuFragmentMain",
targets: [{ format: colorPipeline.canvasFormat }]
},
primitive: { topology: "triangle-list" }
}) : null;
const presentationBindGroupLayout = device.createBindGroupLayout({ entries: [{
binding: 0,
visibility: GPUShaderStage.FRAGMENT,
sampler: { type: "filtering" }
}, {
binding: 1,
visibility: GPUShaderStage.FRAGMENT,
texture: {
sampleType: "float",
viewDimension: "2d",
multisampled: false
}
}] });
const presentationPipelineLayout = device.createPipelineLayout({ bindGroupLayouts: [presentationBindGroupLayout] });
const presentationPipelines = /* @__PURE__ */ new Map();
const buildPresentationPipelineKey = (canvasFormat, dynamicRange, applyFinalTransform, premultiplyAlpha) => {
return `${canvasFormat}|${dynamicRange}|${applyFinalTransform}|${premultiplyAlpha}`;
};
const createPresentationPipeline = async (canvasFormat, dynamicRange, applyFinalTransform, premultiplyAlpha) => {
const key = buildPresentationPipelineKey(canvasFormat, dynamicRange, applyFinalTransform, premultiplyAlpha);
if (presentationPipelines.has(key)) return;
const convertPresentationLinearToSrgb = applyFinalTransform && shouldConvertLinearToSrgb(colorPipeline.outputEncoding, canvasFormat, dynamicRange);
const presentationShaderModule = device.createShaderModule({ code: buildPresentationShader({
toneMapping: applyFinalTransform ? colorPipeline.toneMapping : "none",
convertLinearToSrgb: convertPresentationLinearToSrgb,
dynamicRange,
premultiplyAlpha
}) });
await assertCompilation(presentationShaderModule);
presentationPipelines.set(key, device.createRenderPipeline({
layout: presentationPipelineLayout,
vertex: {
module: presentationShaderModule,
entryPoint: "motiongpuPresentationVertex"
},
fragment: {
module: presentationShaderModule,
entryPoint: "motiongpuPresentationFragment",
targets: [{ format: canvasFormat }]
},
primitive: { topology: "triangle-list" }
}));
};
await createPresentationPipeline(colorPipeline.canvasFormat, colorPipeline.dynamicRange === "auto" ? "hdr" : colorPipeline.dynamicRange, colorPipeline.requiresPresentationPass, true);
if (colorPipeline.dynamicRange === "auto") await createPresentationPipeline(colorPipeline.fallbackCanvasFormat, "sdr", colorPipeline.requiresPresentationPass, true);
const presentationSampler = device.createSampler({
magFilter: "linear",
minFilter: "linear",
addressModeU: "clamp-to-edge",
addressModeV: "clamp-to-edge"
});
let presentationBindGroupByView = /* @__PURE__ */ new WeakMap();
const pingPongTexturePairs = /* @__PURE__ */ new Map();
const pingPongShaderTexturePairs = /* @__PURE__ */ new Map();
for (const key of storageBufferKeys) {
const definition = storageBufferDefinitions[key];
if (!definition) continue;
const normalized = normalizeStorageBufferDefinition(definition);
const usage = GPUBufferUsage.STORAGE | GPUBufferUsage.COPY_DST | GPUBufferUsage.COPY_SRC;
const buffer = device.createBuffer({
size: normalized.size,
usage
});
registerInitializationCleanup(() => {
buffer.destroy();
});
if (definition.initialData !== void 0 && definition.initialData.byteLength > 0) {
const data = definition.initialData;
device.queue.writeBuffer(buffer, 0, data.buffer, data.byteOffset, data.byteLength);
}
resourceRegistry.registerStorageBuffer({
logicalId: key,
buffer,
size: normalized.size,
wgslType: normalized.type,
access: normalized.access,
usage
});
}
const fragmentStorageBindGroup = fragmentStorageBindGroupLayout && storageBufferKeys.length > 0 ? device.createBindGroup({
layout: fragmentStorageBindGroupLayout,
entries: storageBufferKeys.map((key, index) => {
return {
binding: index,
resource: { buffer: resourceRegistry.requireStorageBuffer(key).buffer }
};
})
}) : null;
const ensurePingPongTexturePair = (pass, logicalId) => {
const existing = pingPongTexturePairs.get(pass);
if (existing && existing.logicalId === logicalId) return existing;
if (existing) {
existing.textureA.destroy();
existing.textureB.destroy();
pingPongTexturePairs.delete(pass);
}
const config = normalizedTextureDefinitions[logicalId];
if (!config || !config.storage) throw new Error(`PingPongComputePass resource "${logicalId}" must reference a texture declared with storage:true.`);
if (!config.width || !config.height) throw new Error(`PingPongComputePass resource "${logicalId}" requires explicit texture width and height.`);
const usage = GPUTextureUsage.TEXTURE_BINDING | GPUTextureUsage.STORAGE_BINDING | GPUTextureUsage.COPY_DST;
const textureA = device.createTexture({
size: {
width: config.width,
height: config.height,
depthOrArrayLayers: 1
},
format: config.format,
usage
});
const textureB = device.createTexture({
size: {
width: config.width,
height: config.height,
depthOrArrayLayers: 1
},
format: config.format,
usage
});
registerInitializationCleanup(() => {
textureA.destroy();
});
registerInitializationCleanup(() => {
textureB.destroy();
});
const pair = {
logicalId,
format: config.format,
width: config.width,
height: config.height,
textureA,
viewA: textureA.createView(),
textureB,
viewB: textureB.createView(),
readFromA: true
};
pingPongTexturePairs.set(pass, pair);
return pair;
};
const destroyPingPongShaderTexturePair = (pair) => {
pair.textureA.destroy();
pair.textureB.destroy();
};
const ensurePingPongShaderTexturePair = (pass, options) => {
const existing = pingPongShaderTexturePairs.get(pass);
if (existing && existing.target === options.target && existing.width === options.width && existing.height === options.height && existing.format === options.format && existing.filter === options.filter && existing.addressModeU === options.addressModeU && existing.addressModeV === options.addressModeV) return existing;
if (existing) destroyPingPongShaderTexturePair(existing);
const usage = GPUTextureUsage.TEXTURE_BINDING | GPUTextureUsage.RENDER_ATTACHMENT | GPUTextureUsage.COPY_DST;
const textureA = device.createTexture({
size: {
width: options.width,
height: options.height,
depthOrArrayLayers: 1
},
format: options.format,
usage
});
const textureB = device.createTexture({
size: {
width: options.width,
height: options.height,
depthOrArrayLayers: 1
},
format: options.format,
usage
});
const samplingLayout = resolveTextureSamplingLayout({
format: options.format,
filter: options.filter,
deviceFeatures: device.features
});
const sampler = device.createSampler({
magFilter: samplingLayout.effectiveFilter,
minFilter: samplingLayout.effectiveFilter,
addressModeU: options.addressModeU,
addressModeV: options.addressModeV
});
const pair = {
target: options.target,
format: options.format,
width: options.width,
height: options.height,
filter: options.filter,
addressModeU: options.addressModeU,
addressModeV: options.addressModeV,
sampleType: samplingLayout.sampleType,
samplerType: samplingLayout.samplerType,
effectiveFilter: samplingLayout.effectiveFilter,
textureA,
viewA: textureA.createView(),
textureB,
viewB: textureB.createView(),
sampler,
previousBindGroupLayout: null,
readABindGroup: null,
readBBindGroup: null,
needsClear: true
};
pingPongShaderTexturePairs.set(pass, pair);
return pair;
};
const MAX_COMPUTE_PIPELINE_CACHE_ENTRIES = 32;
const computePipelineCache = /* @__PURE__ */ new Map();
let nextComputePipelineLabelIndex = 0;
const computeResourceLimits = getComputeResourceResolverLimits(device);
const computeUniformTopologyKey = options.uniformLayout.entries.map((entry) => `${entry.name}:${entry.type}`).join(",");
const computeDeviceCapabilityKey = [...Array.from(device.features).sort(), ...Object.entries(computeResourceLimits).map(([name, value]) => `${name}:${value}`)].join(",");
const requestRender = options.requestRender;
const setComputePipelineCacheState = (cacheKey, state) => {
if (computePipelineCache.has(cacheKey)) computePipelineCache.delete(cacheKey);
computePipelineCache.set(cacheKey, state);
while (computePipelineCache.size > MAX_COMPUTE_PIPELINE_CACHE_ENTRIES) {
const oldestKey = computePipelineCache.keys().next().value;
if (oldestKey === void 0) break;
computePipelineCache.delete(oldestKey);
}
};
const touchComputePipelineCacheState = (cacheKey, state) => {
computePipelineCache.delete(cacheKey);
computePipelineCache.set(cacheKey, state);
};
const computeBuildResult = (cacheKey, buildOptions) => {
const builtComputeShader = buildComputeShaderSourceWithMap({
compute: buildOptions.computeSource,
uniformLayout: options.uniformLayout,
resources: buildOptions.resources.entries
});
const labelIndex = nextComputePipelineLabelIndex += 1;
const labelBase = `compute[${buildOptions.resources.topologyKey || "uniforms-only"}]#${labelIndex}`;
const moduleLabel = `${labelBase}:module`;
const pipelineLabel = `${labelBase}:pipeline`;
const workgroupSize = extractWorkgroupSize(buildOptions.computeSource);
const computeUniformBGL = device.createBindGroupLayout({
label: `${labelBase}:bgl-uniforms`,
entries: [{
binding: FRAME_BINDING,
visibility: GPUShaderStage.COMPUTE,
buffer: {
type: "uniform",
minBindingSize: 16
}
}, {
binding: UNIFORM_BINDING,
visibility: GPUShaderStage.COMPUTE,
buffer: { type: "uniform" }
}]
});
const resourceBindGroupLayout = buildOptions.resources.entries.length > 0 ? device.createBindGroupLayout({
label: `${labelBase}:bgl-resources`,
entries: buildOptions.resources.entries.map((entry) => entry.layoutEntry)
}) : null;
const bindGroupLayouts = [computeUniformBGL];
if (resourceBindGroupLayout) bindGroupLayouts.push(resourceBindGroupLayout);
const computePipelineLayout = device.createPipelineLayout({
label: `${labelBase}:layout`,
bindGroupLayouts
});
device.pushErrorScope("validation");
let computeShaderModule;
let pipeline;
try {
computeShaderModule = device.createShaderModule({
label: moduleLabel,
code: builtComputeShader.code
});
pipeline = device.createComputePipeline({
label: pipelineLabel,
layout: computePipelineLayout,
compute: {
module: computeShaderModule,
entryPoint: "compute"
}
});
} catch (jsError) {
device.popErrorScope().catch(() => {});
return {
kind: "error",
error: toComputeCompilationError({
error: jsError,
lineMap: builtComputeShader.lineMap,
computeSource: buildOptions.computeSource,
runtimeContext
})
};
}
const validationScope = device.popErrorScope();
const computeUniformBindGroup = device.createBindGroup({
label: `${labelBase}:bg-uniforms`,
layout: computeUniformBGL,
entries: [{
binding: FRAME_BINDING,
resource: { buffer: frameBuffer }
}, {
binding: UNIFORM_BINDING,
resource: { buffer: uniformBuffer }
}]
});
const entry = {
pipeline,
uniformBindGroup: computeUniformBindGroup,
resourceBindGroupLayout,
resourceBindGroupCaches: /* @__PURE__ */ new WeakMap(),
pingPongResourceBindGroupCaches: /* @__PURE__ */ new WeakMap(),
workgroupSize,
computeSource: buildOptions.computeSource,
topologyKey: buildOptions.resources.topologyKey
};
return {
kind: "pending",
entry,
validation: (async () => {
const compilationError = await assertComputeCompilationAsync({
module: computeShaderModule,
validationScope,
lineMap: builtComputeShader.lineMap,
computeSource: buildOptions.computeSource,
runtimeContext
});
if (isDestroyed) return;
const current = computePipelineCache.get(cacheKey);
if (!current || current.kind !== "pending") return;
if (compilationError) {
setComputePipelineCacheState(cacheKey, {
kind: "error",
error: compilationError
});
uncapturedErrorMessages.length = 0;
requestRender?.();
} else setComputePipelineCacheState(cacheKey, {
kind: "ready",
entry
});
})()
};
};
const buildComputePipelineEntry = (buildOptions) => {
const cacheKey = `compute:${computeUniformTopologyKey}:${buildOptions.resources.topologyKey}:${computeDeviceCapabilityKey}:${buildOptions.computeSource}`;
const cached = computePipelineCache.get(cacheKey);
if (cached) {
touchComputePipelineCacheState(cacheKey, cached);
if (cached.kind === "error") {
uncapturedErrorMessages.length = 0;
throw cached.error;
}
return cached.entry;
}
const state = computeBuildResult(cacheKey, buildOptions);
setComputePipelineCacheState(cacheKey, state);
if (state.kind === "error") {
uncapturedErrorMessages.length = 0;
throw state.error;
}
return state.entry;
};
const pingPongShaderPipelineCache = /* @__PURE__ */ new Map();
const getFragmentTextureBindingsForKeys = (keys) => keys.map((key, index) => {
const binding = textureBindingByKey.get(key);
if (!binding || !binding.fragmentVisible) throw new Error(`Missing fragment texture binding for "${key}".`);
return {
...binding,
...getTextureBindings(index)
};
});
const buildPingPongShaderPipelineEntry = (pass, format, target) => {
const fragment = pass.getFragment?.();
if (!fragment) throw new Error("PingPongShaderPass must provide a fragment shader.");
const feedbackTextureKeys = fragmentTextureKeys.filter((key) => key !== target);
const previousSamplingLayout = resolveTextureSamplingLayout({
format,
filter: pass.getFilter?.() ?? "linear",
deviceFeatures: device.features
});
const cacheKey = [
format,
target,
previousSamplingLayout.sampleType,
previousSamplingLayout.samplerType,
previousSamplingLayout.effectiveFilter,
feedbackTextureKeys.join(","),
options.uniformLayout.entries.map((entry) => `${entry.name}:${entry.type}`).join(","),
fragment
].join("|");
const cached = pingPongShaderPipelineCache.get(cacheKey);
if (cached) return cached;
const fragmentLineMap = pass.getFragmentLineMap?.();
const builtShader = buildPingPongShaderSourceWithMap(fragment, options.uniformLayout, feedbackTextureKeys, fragmentLineMap ? { fragmentLineMap } : {});
const shaderModule = device.createShaderModule({ code: builtShader.code });
const feedbackBindGroupLayout = device.createBindGroupLayout({ entries: createBindGroupLayoutEntries(getFragmentTextureBindingsForKeys(feedbackTextureKeys)) });
const previousBindGroupLayout = device.createBindGroupLayout({ entries: [{
binding: 0,
visibility: GPUShaderStage.FRAGMENT,
sampler: { type: previousSamplingLayout.samplerType }
}, {
binding: 1,
visibility: GPUShaderStage.FRAGMENT,
texture: {
sampleType: previousSamplingLayout.sampleType,
viewDimension: "2d",
multisampled: false
}
}] });
const pipelineLayout = device.createPipelineLayout({ bindGroupLayouts: [feedbackBindGroupLayout, previousBindGroupLayout] });
const entry = {
pipeline: device.createRenderPipeline({
layout: pipelineLayout,
vertex: {
module: shaderModule,
entryPoint: "motiongpuPingPongVertex"
},
fragment: {
module: shaderModule,
entryPoint: "motiongpuPingPongFragment",
targets: [{ format }]
},
primitive: { topology: "triangle-list" }
}),
bindGroupLayout: feedbackBindGroupLayout,
previousBindGroupLayout,
textureKeys: feedbackTextureKeys
};
pingPongShaderPipelineCache.set(cacheKey, entry);
return entry;
};
const getComputeBindingResource = (entry) => {
if (entry.source === "external") return entry.bindingResource;
const logicalId = String(entry.logicalId);
switch (entry.kind) {
case "sampled-texture": {
const resource = resourceRegistry.requireTexture(logicalId);
if (entry.subresource.baseMipLevel === 0 && entry.subresource.mipLevelCount === resource.mipLevelCount) return resource.publishedView;
return entry.bindingResource;
}
case "storage-texture": {
const view = resourceRegistry.requireTexture(logicalId).storageView;
if (!view) throw new Error(`Storage texture "${logicalId}" is not allocated.`);
return view;
}
case "storage-buffer": return {
buffer: resourceRegistry.requireStorageBuffer(logicalId).buffer,
size: entry.size
};
case "sampler": {
const binding = textureBindingByKey.get(logicalId);
if (!binding) throw new Error(`Material sampler "${logicalId}" is not available.`);
return binding.sampler;
}
}
};
const getBindingReference = (resource) => "buffer" in resource ? resource.buffer : resource;
const createResolvedBindGroupEntries = (resources, pingPong) => {
const entries = [];
const refs = [];
for (const entry of resources.entries) {
let resource = getComputeBindingResource(entry);
if (pingPong && entry.kind === "sampled-texture" && entry.pingPong === "read") resource = pingPong.readFromA ? pingPong.pair.viewA : pingPong.pair.viewB;
else if (pingPong && entry.kind === "storage-texture" && entry.pingPong === "write") resource = pingPong.readFromA ? pingPong.pair.viewB : pingPong.pair.viewA;
entries.push({
binding: entry.binding,
resource
});
refs.push(getBindingReference(resource));
}
return {
entries,
refs
};
};
const getComputeResourceBindGroup = (pipelineEntry, pass, resources) => {
if (!pipelineEntry.resourceBindGroupLayout) return null;
let cache = pipelineEntry.resourceBindGroupCaches.get(pass);
if (!cache) {
cache = createComputeBindGroupCache(device);
pipelineEntry.resourceBindGroupCaches.set(pass, cache);
}
const runtimeEntries = createResolvedBindGroupEntries(resources);
return cache.getOrCreate({
topologyKey: resources.topologyKey,
layout: pipelineEntry.resourceBindGroupLayout,
entries: runtimeEntries.entries,
resourceRefs: runtimeEntries.refs
});
};
const getPingPongResourceBindGroup = (pipelineEntry, pass, resources, pair, readFromA) => {
if (!pipelineEntry.resourceBindGroupLayout) throw new Error("Ping-pong compute pipeline is missing its resource bind group layout.");
let caches = pipelineEntry.pingPongResourceBindGroupCaches.get(pass);
if (!caches) {
caches = {
readA: createComputeBindGroupCache(device),
readB: createComputeBindGroupCache(device)
};
pipelineEntry.pingPongResourceBindGroupCaches.set(pass, caches);
}
const runtimeEntries = createResolvedBindGroupEntries(resources, {
pair,
readFromA
});
const bindGroup = (readFromA ? caches.readA : caches.readB).getOrCreate({
topologyKey: resources.topologyKey,
layout: pipelineEntry.resourceBindGroupLayout,
entries: runtimeEntries.entries,
resourceRefs: runtimeEntries.refs
});
if (!bindGroup) throw new Error("Ping-pong compute resource bind group is empty.");
return bindG