@woosh/meep-engine 3.60.8 → 3.60.9

package/src/shade/renderer/material/dispatch/gbuffer_compute.js

@@ -0,0 +1,249 @@
+import { GPUShaderStage } from "../../../descriptor/GPUShaderStage.js";
+import { ComputePipelineDescriptor } from "../../../descriptor/pipeline/compute/ComputePipelineDescriptor.js";
+import { PipelineLayoutDescriptor } from "../../../descriptor/pipeline/PipelineLayoutDescriptor.js";
+import { WebGPUExtensionType } from "../../../descriptor/WebGPUExtensionType.js";
+import { G_BUFFER_COLOR_TARGETS } from "../../gbuffer/G_BUFFER_COLOR_TARGETS.js";
+import { chunk_subgroup_reserve_workgroup } from "../../shader/chunk/subgroup/chunk_subgroup_reserve_workgroup.js";
+import { chunk_folded_workgroup_index } from "../../shader/chunk/grid/chunk_folded_workgroup_index.js";
+import { CodeChunk } from "../../shader/compiler/CodeChunk.js";
+import { ShaderResourceGroupDescriptor } from "../../shader/resource/ShaderResourceGroupDescriptor.js";
+import { ShaderResourceSetDescriptor } from "../../shader/resource/ShaderResourceSetDescriptor.js";
+import { ShaderDescriptor } from "../../shader/ShaderDescriptor.js";
+import { u32 } from "../../shader/type/WEBGPU_WGSL_PRIMITIVE_TYPES.js";
+import { WebGPUArray } from "../../shader/type/WebGPUArray.js";
+import { WebGPUStruct } from "../../shader/type/WebGPUStruct.js";
+import {
+    add_g_buffer_viz_resources,
+    build_gbuffer_laydown,
+    g_buffer_scene_resources
+} from "../standard/fragment_gbuffer.js";
+import { chunk_material_quad_pack } from "./chunk_material_quad_pack.js";
+import { MATERIAL_DISPATCH_GROUP_SIZE, MATERIAL_DISPATCH_QUADS_PER_GROUP } from "./MATERIAL_DISPATCH_CONSTANTS.js";
+
+/**
+ * What one material's compute dispatch is for: its indirect workgroup counts, which the dispatch is
+ * issued with, and the run of the pixel list it shades. Written by
+ * {@link shader_material_dispatch_commands}, one per material at
+ * {@link MATERIAL_DISPATCH_RECORD_STRIDE}, and bound to the dispatch as its own uniform.
+ *
+ * @type {WebGPUStruct}
+ */
+export const MATERIAL_DISPATCH_RECORD_STRUCT = WebGPUStruct.from({
+    groups_x: u32,
+    groups_y: u32,
+    groups_z: u32,
+    /**
+     * Index of the material's first quad in the list.
+     */
+    start: u32,
+    /**
+     * How many quads the material has — 2×2 quads of pixels holding at least one of its pixels.
+     */
+    count: u32,
+}, "MaterialDispatchRecord");
+
+/**
+ * @typedef {import("../../../descriptor/binding/BindGroupLayoutDescriptor.js").BindGroupLayoutDescriptor} BindGroupLayoutDescriptor
+ */
+
+/**
+ * Group 1 of every template's compute G-buffer pipeline: what {@link build_gbuffer_laydown} reads
+ * of the visibility buffer and the view, under the names the laydown reads them by, then the quad
+ * lists the dispatch walks and the G-buffer it writes.
+ *
+ * One bind group a frame serves every template.
+ *
+ * @type {ShaderResourceGroupDescriptor}
+ */
+export const g_buffer_viz_compute_resources = new ShaderResourceGroupDescriptor();
+
+g_buffer_viz_compute_resources.label = "viz buffer / compute";
+
+add_g_buffer_viz_resources(g_buffer_viz_compute_resources)
+    // every material's quads, each as chunk_material_quad_pack packs it
+    .addStorageBuffer("material_quads", WebGPUArray.u32)
+    .addStorageTexture("g_buffer_pbr", G_BUFFER_COLOR_TARGETS[0].format, "2d", "write-only")
+    .addStorageTexture("g_buffer_normal", G_BUFFER_COLOR_TARGETS[1].format, "2d", "write-only")
+    .addStorageTexture("g_buffer_albedo", G_BUFFER_COLOR_TARGETS[2].format, "2d", "write-only")
+    .addStorageTexture("g_buffer_emissive", G_BUFFER_COLOR_TARGETS[3].format, "2d", "write-only")
+;
+
+g_buffer_viz_compute_resources.addVisibility(GPUShaderStage.COMPUTE);
+
+/**
+ * Group 3 of every template's compute G-buffer pipeline: the dispatch's own record. A bind group
+ * per material, over that material's slice of the record buffer, so the shader learns which run of
+ * the pixel list is its own from the one thing that differs between the dispatches.
+ *
+ * @type {ShaderResourceGroupDescriptor}
+ */
+export const g_buffer_dispatch_resources = new ShaderResourceGroupDescriptor();
+
+g_buffer_dispatch_resources.label = "material dispatch";
+
+g_buffer_dispatch_resources.addUniform("material_dispatch", MATERIAL_DISPATCH_RECORD_STRUCT);
+
+g_buffer_dispatch_resources.addVisibility(GPUShaderStage.COMPUTE);
+
+/**
+ * Group 1 as every compute G-buffer pipeline lays it out.
+ *
+ * @type {BindGroupLayoutDescriptor}
+ */
+export const GBUFFER_COMPUTE_VIZ_LAYOUT = g_buffer_viz_compute_resources.generateBindGroupLayoutDescriptor(GPUShaderStage.COMPUTE);
+
+/**
+ * Group 2 as every compute G-buffer pipeline lays it out: the fragment pipelines' scene group,
+ * visible to compute.
+ *
+ * @type {BindGroupLayoutDescriptor}
+ */
+export const GBUFFER_COMPUTE_SCENE_LAYOUT = g_buffer_scene_resources.generateBindGroupLayoutDescriptor(GPUShaderStage.COMPUTE);
+
+/**
+ * Group 3 as every compute G-buffer pipeline lays it out.
+ *
+ * @type {BindGroupLayoutDescriptor}
+ */
+export const GBUFFER_COMPUTE_DISPATCH_LAYOUT = g_buffer_dispatch_resources.generateBindGroupLayoutDescriptor(GPUShaderStage.COMPUTE);
+
+/**
+ * The resource set of a compute G-buffer pipeline whose group 0 is `material_group`: the template's
+ * own group 0 and the fragment pipelines' group 2, which this code reads under the same names, and
+ * groups 1 and 3 of its own.
+ *
+ * @param {ShaderResourceGroupDescriptor} material_group
+ * @returns {ShaderResourceSetDescriptor}
+ */
+export function build_gbuffer_compute_shader_resources(material_group) {
+    const resources = new ShaderResourceSetDescriptor();
+
+    resources.addGroup(material_group);
+    resources.addGroup(g_buffer_viz_compute_resources);
+    resources.addGroup(g_buffer_scene_resources);
+    resources.addGroup(g_buffer_dispatch_resources);
+
+    return resources;
+}
+
+/**
+ * `fn gbuffer_fwidth(v: vec2<f32>) -> vec2<f32>` for {@link build_gbuffer_laydown} in the compute
+ * material dispatch, whose quad of lanes is a 2×2 quad of pixels: `fwidth` taken coarse, across the
+ * quad's top row and left column. That is what a fragment's `fwidth` is on D3D12; WGSL lets a backend
+ * take it fine instead, and there the two paths' filtered roughness differs where the normal varies
+ * between a quad's rows.
+ *
+ * Called from uniform control flow, with every lane of the quad running the laydown.
+ *
+ * @type {CodeChunk}
+ */
+export const chunk_gbuffer_fwidth_quad = CodeChunk.from(
+// language=WGSL
+    `
+@diagnostic(off, subgroup_uniformity)
+fn gbuffer_fwidth(v: vec2<f32>) -> vec2<f32> {
+    let top_left = quadBroadcast(v, 0u);
+
+    return abs(quadBroadcast(v, 1u) - top_left) + abs(quadBroadcast(v, 2u) - top_left);
+}
+`);
+
+chunk_gbuffer_fwidth_quad.addExtension(WebGPUExtensionType.Subgroups);
+
+/**
+ * The compute entry of a template's G-buffer pipeline: a quad of lanes per 2×2 quad of pixels in
+ * the material's run of the list, {@link build_gbuffer_laydown} at each pixel's centre, and the
+ * result stored, for the pixels of the quad that are the material's, where the fragment dispatch's
+ * colour targets would have taken it.
+ *
+ * The quad's other pixels run the laydown as a fragment quad's helper lanes do, so the derivative
+ * the laydown takes is a fragment quad's — see {@link chunk_gbuffer_fwidth_quad}. So does the tail
+ * of the material's last workgroup, on its last quad again; every lane of a workgroup that holds any
+ * of the list runs the laydown, which keeps the quad operations in uniform control flow, and a
+ * workgroup wholly past the list leaves at once.
+ *
+ * Lanes take their places in subgroup order, through {@link chunk_subgroup_reserve_workgroup}, so a
+ * quad of places is a quad of lanes however subgroups are laid over the workgroup.
+ *
+ * Dispatched with a folded command — see {@link chunk_folded_workgroup_index} — so one material can
+ * cover more of the screen than one dispatch dimension reaches.
+ *
+ * @param {CodeChunk} surface defines `fn material_surface(s: MaterialSurfaceInput) -> MaterialSurfaceOutput`
+ * @returns {CodeChunk}
+ */
+export function build_gbuffer_compute_body(surface) {
+    return CodeChunk.from(
+// language=WGSL
+        `
+var<workgroup> material_dispatch_places: atomic<u32>;
+
+@compute @workgroup_size(${MATERIAL_DISPATCH_GROUP_SIZE})
+fn main(
+    @builtin(workgroup_id) workgroup_id : vec3<u32>,
+) {
+    let first_quad = folded_workgroup_index(workgroup_id) * ${MATERIAL_DISPATCH_QUADS_PER_GROUP}u;
+    let count = material_dispatch.count;
+
+    // a folded grid's last row runs past the list; the whole workgroup leaves together, so what
+    // follows stays in uniform control flow
+    if (first_quad >= count) {
+        return;
+    }
+
+    let place = subgroup_reserve_workgroup(&material_dispatch_places, 1u);
+
+    let quad_index = first_quad + place / 4u;
+    let corner = place & 3u;
+
+    let in_list = quad_index < count;
+
+    let entry = material_quad_unpack(material_quads[material_dispatch.start + min(quad_index, count - 1u)]);
+
+    let pixel = entry.quad * 2u + vec2<u32>(corner & 1u, corner >> 1u);
+
+    // the pixel's centre, which is what a fragment's position holds
+    let g = gbuffer_laydown(vec2<f32>(pixel) + vec2<f32>(0.5));
+
+    if (in_list && ((entry.mask >> corner) & 1u) != 0u) {
+        textureStore(g_buffer_pbr, pixel, vec4<f32>(g.pbr, 0.0, 0.0));
+        textureStore(g_buffer_normal, pixel, g.normal);
+        textureStore(g_buffer_albedo, pixel, g.albedo);
+        textureStore(g_buffer_emissive, pixel, vec4<u32>(g.emissive, 0u, 0u, 0u));
+    }
+}`, [
+            build_gbuffer_laydown(surface, chunk_gbuffer_fwidth_quad),
+            chunk_folded_workgroup_index,
+            chunk_subgroup_reserve_workgroup,
+            chunk_material_quad_pack,
+        ]
+    );
+}
+
+/**
+ * The compute G-buffer pipeline of a template: its group 0 and surface function around the shared
+ * laydown. Every group is laid out for the compute stage, whatever stages its declaration names, so
+ * no template has to declare anything for this pipeline: a material's group 0 for it is a bind group
+ * of its own, made by the template's own hook over this layout.
+ *
+ * @param {Object} options
+ * @param {string} options.label
+ * @param {ShaderResourceGroupDescriptor} options.material_group the template's group 0
+ * @param {CodeChunk} options.surface defines `material_surface`
+ * @returns {ComputePipelineDescriptor}
+ */
+export function build_gbuffer_compute_pipeline_descriptor({ label, material_group, surface }) {
+    const shader = ShaderDescriptor.from({
+        label,
+        resources: build_gbuffer_compute_shader_resources(material_group),
+        body: build_gbuffer_compute_body(surface),
+    });
+
+    const layout = PipelineLayoutDescriptor.from([
+        material_group.generateBindGroupLayoutDescriptor(GPUShaderStage.COMPUTE),
+        GBUFFER_COMPUTE_VIZ_LAYOUT,
+        GBUFFER_COMPUTE_SCENE_LAYOUT,
+        GBUFFER_COMPUTE_DISPATCH_LAYOUT,
+    ]);
+
+    return ComputePipelineDescriptor.from(label, shader.source, layout);
+}

package/src/shade/renderer/material/dispatch/graph_material_dispatch_compute.d.ts

@@ -0,0 +1,56 @@
+/**
+ * Lay the G-buffer down with the compute material dispatch — see {@link MaterialDispatch.Compute}:
+ *
+ * 1. **count** every 2×2 quad into the (material, tile) list of each material it holds, and clear
+ *    the pixels no material shades;
+ * 2. **scan** the counts, so each list knows where it starts;
+ * 3. write each material's **dispatch record** — its run of the lists and its workgroup counts;
+ * 4. **scatter** every quad into its lists;
+ * 5. **shade**: one compute pass, one indirect dispatch per material over its own run, with the
+ *    material's compute bind group, its template's compute pipeline, and its record as group 3.
+ *
+ * The material lists are ordered as `contexts` is, which is by template, so pipeline switches in the
+ * shade pass are one per template; within a material its quads run tile by tile.
+ *
+ * @param {Object} options
+ * @param {FrameGraph} options.graph
+ * @param {GPUViewContext} options.view
+ * @param {GPUMaterialContext[]} options.contexts the G-buffer materials, as the fragment dispatch
+ *   draws them
+ * @param {Uint32Array} options.material_slots a {@link cpu_hash_table_create} table from each
+ *   context's material id to its place in `contexts`
+ * @param {MaterialDispatchRecords} options.records with room for every context
+ * @param {BindGroupManager} options.bindings
+ * @param {function(GPUMaterialContext):GPUComputePipeline} options.pipeline_of the context's
+ *   compute G-buffer pipeline
+ * @param {function(GPUMaterialContext):GPUBindGroup} options.group_of the context's group 0 for
+ *   that pipeline
+ * @param {number} options.texture_viz_mesh
+ * @param {number} options.texture_viz_triangle
+ * @param {number} options.texture_normal
+ * @returns {{g_pbr: number, g_normal: number, g_albedo: number, g_emissive: number}}
+ */
+export function graph_material_dispatch_compute({ graph, view, contexts, material_slots, records, bindings, pipeline_of, group_of, texture_viz_mesh, texture_viz_triangle, texture_normal, }: {
+    graph: FrameGraph;
+    view: GPUViewContext;
+    contexts: GPUMaterialContext[];
+    material_slots: Uint32Array;
+    records: MaterialDispatchRecords;
+    bindings: BindGroupManager;
+    pipeline_of: (arg0: GPUMaterialContext) => GPUComputePipeline;
+    group_of: (arg0: GPUMaterialContext) => GPUBindGroup;
+    texture_viz_mesh: number;
+    texture_viz_triangle: number;
+    texture_normal: number;
+}): {
+    g_pbr: number;
+    g_normal: number;
+    g_albedo: number;
+    g_emissive: number;
+};
+export type FrameGraph = import("../../../../engine/graphics/render/frame_graph/FrameGraph.js").FrameGraph;
+export type BindGroupManager = import("../../binding/BindGroupManager.js").BindGroupManager;
+export type GPUViewContext = import("../../view/GPUViewContext.js").GPUViewContext;
+export type GPUMaterialContext = import("../GPUMaterialContext.js").GPUMaterialContext;
+export type MaterialDispatchRecords = import("./MaterialDispatchRecords.js").MaterialDispatchRecords;
+//# sourceMappingURL=graph_material_dispatch_compute.d.ts.map

package/src/shade/renderer/material/dispatch/graph_material_dispatch_compute.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"graph_material_dispatch_compute.d.ts","sourceRoot":"","sources":["../../../../../../src/shade/renderer/material/dispatch/graph_material_dispatch_compute.js"],"names":[],"mappings":"AAkDA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA+BG;AACH;IAjB+B,KAAK,EAAzB,UAAU;IACc,IAAI,EAA5B,cAAc;IACgB,QAAQ,EAAtC,kBAAkB,EAAE;IAEC,cAAc,EAAnC,WAAW;IAEsB,OAAO,EAAxC,uBAAuB;IACG,QAAQ,EAAlC,gBAAgB;IACyC,WAAW,SAA3D,kBAAkB;IAEwB,QAAQ,SAAlD,kBAAkB;IAEX,gBAAgB,EAAhC,MAAM;IACU,oBAAoB,EAApC,MAAM;IACU,cAAc,EAA9B,MAAM;IACJ;IAAC,KAAK,EAAE,MAAM,CAAC;IAAC,QAAQ,EAAE,MAAM,CAAC;IAAC,QAAQ,EAAE,MAAM,CAAC;IAAC,UAAU,EAAE,MAAM,CAAA;CAAC,CA0OnF;yBA/RY,OAAO,8DAA8D,EAAE,UAAU;+BACjF,OAAO,mCAAmC,EAAE,gBAAgB;6BAC5D,OAAO,8BAA8B,EAAE,cAAc;iCACrD,OAAO,0BAA0B,EAAE,kBAAkB;sCACrD,OAAO,8BAA8B,EAAE,uBAAuB"}

package/src/shade/renderer/material/dispatch/graph_material_dispatch_compute.js

@@ -0,0 +1,315 @@
+import { assert } from "../../../../core/assert.js";
+import { round_up } from "../../../../core/math/round_up.js";
+import { BufferResourceDescriptor } from "../../../device/graph/BufferResourceDescriptor.js";
+import { TextureResourceDescriptor } from "../../../device/graph/TextureResourceDescriptor.js";
+import { BindGroupDescriptor } from "../../binding/BindGroupDescriptor.js";
+import { G_BUFFER_COLOR_TARGETS } from "../../gbuffer/G_BUFFER_COLOR_TARGETS.js";
+import {
+    graph_prefix_scan_csdldf,
+    prefix_scan_csdldf_output_descriptor
+} from "../../gpu_primitive/prefix_sum/v1/graph_prefix_scan_csdldf.js";
+import { graph_create_buffer } from "../../shader/graph/graph_create_buffer.js";
+import { graph_import_buffer } from "../../shader/graph/graph_import_buffer.js";
+import { graph_import_raw_buffer } from "../../shader/graph/graph_import_raw_buffer.js";
+import { GBUFFER_COMPUTE_SCENE_LAYOUT, GBUFFER_COMPUTE_VIZ_LAYOUT } from "./gbuffer_compute.js";
+import {
+    MATERIAL_CLASSIFY_BLOCK_SIZE,
+    MATERIAL_DISPATCH_RECORD_STRIDE,
+    MATERIAL_DISPATCH_TILE_SIZE
+} from "./MATERIAL_DISPATCH_CONSTANTS.js";
+import {
+    MATERIAL_DISPATCH_COMMANDS_SETTINGS_STRUCT,
+    shader_material_dispatch_commands
+} from "./shader_material_dispatch_commands.js";
+import { MATERIAL_CLASSIFY_SETTINGS_STRUCT, shader_material_pixel_count } from "./shader_material_pixel_count.js";
+import { shader_material_pixel_scatter } from "./shader_material_pixel_scatter.js";
+
+/**
+ * @typedef {import("../../../../engine/graphics/render/frame_graph/FrameGraph.js").FrameGraph} FrameGraph
+ * @typedef {import("../../binding/BindGroupManager.js").BindGroupManager} BindGroupManager
+ * @typedef {import("../../view/GPUViewContext.js").GPUViewContext} GPUViewContext
+ * @typedef {import("../GPUMaterialContext.js").GPUMaterialContext} GPUMaterialContext
+ * @typedef {import("./MaterialDispatchRecords.js").MaterialDispatchRecords} MaterialDispatchRecords
+ */
+
+/**
+ * The G-buffer targets the compute dispatch creates, in the formats every G-buffer pass writes, and
+ * written as storage. They stay render attachments for whatever composites into them later.
+ *
+ * @param {GPUTextureFormat} format
+ * @param {number[]} resolution
+ * @returns {TextureResourceDescriptor}
+ */
+function storage_target(format, resolution) {
+    return TextureResourceDescriptor.from({
+        format,
+        resolution,
+        usage: GPUTextureUsage.RENDER_ATTACHMENT | GPUTextureUsage.TEXTURE_BINDING | GPUTextureUsage.STORAGE_BINDING,
+    });
+}
+
+/**
+ * Lay the G-buffer down with the compute material dispatch — see {@link MaterialDispatch.Compute}:
+ *
+ * 1. **count** every 2×2 quad into the (material, tile) list of each material it holds, and clear
+ *    the pixels no material shades;
+ * 2. **scan** the counts, so each list knows where it starts;
+ * 3. write each material's **dispatch record** — its run of the lists and its workgroup counts;
+ * 4. **scatter** every quad into its lists;
+ * 5. **shade**: one compute pass, one indirect dispatch per material over its own run, with the
+ *    material's compute bind group, its template's compute pipeline, and its record as group 3.
+ *
+ * The material lists are ordered as `contexts` is, which is by template, so pipeline switches in the
+ * shade pass are one per template; within a material its quads run tile by tile.
+ *
+ * @param {Object} options
+ * @param {FrameGraph} options.graph
+ * @param {GPUViewContext} options.view
+ * @param {GPUMaterialContext[]} options.contexts the G-buffer materials, as the fragment dispatch
+ *   draws them
+ * @param {Uint32Array} options.material_slots a {@link cpu_hash_table_create} table from each
+ *   context's material id to its place in `contexts`
+ * @param {MaterialDispatchRecords} options.records with room for every context
+ * @param {BindGroupManager} options.bindings
+ * @param {function(GPUMaterialContext):GPUComputePipeline} options.pipeline_of the context's
+ *   compute G-buffer pipeline
+ * @param {function(GPUMaterialContext):GPUBindGroup} options.group_of the context's group 0 for
+ *   that pipeline
+ * @param {number} options.texture_viz_mesh
+ * @param {number} options.texture_viz_triangle
+ * @param {number} options.texture_normal
+ * @returns {{g_pbr: number, g_normal: number, g_albedo: number, g_emissive: number}}
+ */
+export function graph_material_dispatch_compute({
+                                                    graph,
+                                                    view,
+                                                    contexts,
+                                                    material_slots,
+                                                    records,
+                                                    bindings,
+                                                    pipeline_of,
+                                                    group_of,
+                                                    texture_viz_mesh,
+                                                    texture_viz_triangle,
+                                                    texture_normal,
+                                                }) {
+    assert.defined(graph, 'graph');
+    assert.defined(view, 'view');
+    assert.isArray(contexts, 'contexts');
+
+    const resolution = view.resolution;
+
+    const width = resolution[0];
+    const height = resolution[1];
+
+    const tiles_x = Math.ceil(width / MATERIAL_DISPATCH_TILE_SIZE);
+    const tile_count = tiles_x * Math.ceil(height / MATERIAL_DISPATCH_TILE_SIZE);
+
+    const slot_count = contexts.length;
+    // never empty: an empty list still clears the G-buffer, and the scan wants room for one
+    const list_count = Math.max(1, slot_count * tile_count);
+
+    const classify_settings = {
+        resolution,
+        tiles_x,
+        tile_count,
+        slot_count,
+    };
+
+    const block_count_x = Math.ceil(width / MATERIAL_CLASSIFY_BLOCK_SIZE);
+    const block_count_y = Math.ceil(height / MATERIAL_CLASSIFY_BLOCK_SIZE);
+
+    // at least one, so there is a buffer to name in the graph when the list is empty
+    records.reserve(Math.max(1, slot_count));
+
+    const gr_material_slots = graph_import_raw_buffer({
+        graph,
+        value: material_slots.buffer,
+        offset: material_slots.byteOffset,
+        size: material_slots.byteLength,
+        label: "material slots",
+        usage: GPUBufferUsage.STORAGE,
+    });
+
+    // 1. count
+    const count_data = {};
+
+    const count_pass = graph.add("Material dispatch / count", count_data, (data, resources, context) => {
+        const encoder = context.encoder;
+
+        shader_material_pixel_count.dispatch({
+            encoder,
+            bindings: {
+                viz_buffer_mesh: resources.get(data.viz_mesh).obtainView(),
+                material_slots: resources.get(data.material_slots),
+                counts: resources.get(data.counts),
+                settings: encoder.allocateTransientValueBuffer(MATERIAL_CLASSIFY_SETTINGS_STRUCT, classify_settings, GPUBufferUsage.UNIFORM),
+                g_buffer_pbr: resources.get(data.g_pbr).obtainView(),
+                g_buffer_normal: resources.get(data.g_normal).obtainView(),
+                g_buffer_albedo: resources.get(data.g_albedo).obtainView(),
+                g_buffer_emissive: resources.get(data.g_emissive).obtainView(),
+                scene_database: view.scene.scene_database_buffer,
+            },
+            group_count_x: block_count_x,
+            group_count_y: block_count_y,
+        });
+    });
+
+    count_data.viz_mesh = count_pass.read(texture_viz_mesh);
+    count_data.material_slots = count_pass.read(gr_material_slots);
+    count_data.counts = count_pass.create("material pixel counts", BufferResourceDescriptor.empty(
+        round_up(16 + list_count * 4, 16),
+        GPUBufferUsage.STORAGE
+    ));
+    count_data.g_pbr = count_pass.create("g-buffer / PBR", storage_target(G_BUFFER_COLOR_TARGETS[0].format, resolution));
+    count_data.g_normal = count_pass.write(texture_normal);
+    count_data.g_albedo = count_pass.create("g-buffer / Albedo", storage_target(G_BUFFER_COLOR_TARGETS[2].format, resolution));
+    count_data.g_emissive = count_pass.create("g-buffer / Emissive", storage_target(G_BUFFER_COLOR_TARGETS[3].format, resolution));
+
+    // 2. scan
+    const gr_offsets = graph_prefix_scan_csdldf({
+        graph,
+        input: count_data.counts,
+        output: graph_create_buffer(graph, "material pixel offsets", prefix_scan_csdldf_output_descriptor(list_count)),
+        element_max_count: list_count,
+    });
+
+    // 3. dispatch records
+    const commands_settings = { tile_count, slot_count };
+
+    const commands_data = {};
+
+    const commands_pass = graph.add("Material dispatch / commands", commands_data, (data, resources, context) => {
+        if (slot_count === 0) {
+            return;
+        }
+
+        const encoder = context.encoder;
+
+        shader_material_dispatch_commands.dispatchThreads({
+            encoder,
+            bindings: {
+                offsets: resources.get(data.offsets),
+                records: resources.get(data.records),
+                settings: encoder.allocateTransientValueBuffer(MATERIAL_DISPATCH_COMMANDS_SETTINGS_STRUCT, commands_settings, GPUBufferUsage.UNIFORM),
+            },
+            thread_count_x: slot_count,
+        });
+    });
+
+    commands_data.offsets = commands_pass.read(gr_offsets);
+    commands_data.records = commands_pass.write(graph_import_buffer(graph, records.buffer, "material dispatch records"));
+
+    // 4. scatter
+    const scatter_data = {};
+
+    const scatter_pass = graph.add("Material dispatch / scatter", scatter_data, (data, resources, context) => {
+        const encoder = context.encoder;
+
+        shader_material_pixel_scatter.dispatch({
+            encoder,
+            bindings: {
+                viz_buffer_mesh: resources.get(data.viz_mesh).obtainView(),
+                material_slots: resources.get(data.material_slots),
+                settings: encoder.allocateTransientValueBuffer(MATERIAL_CLASSIFY_SETTINGS_STRUCT, classify_settings, GPUBufferUsage.UNIFORM),
+                offsets: resources.get(data.offsets),
+                cursors: resources.get(data.cursors),
+                material_quads: resources.get(data.material_quads),
+                scene_database: view.scene.scene_database_buffer,
+            },
+            group_count_x: block_count_x,
+            group_count_y: block_count_y,
+        });
+    });
+
+    scatter_data.viz_mesh = scatter_pass.read(texture_viz_mesh);
+    scatter_data.material_slots = scatter_pass.read(gr_material_slots);
+    scatter_data.offsets = scatter_pass.read(gr_offsets);
+    scatter_data.cursors = scatter_pass.create("material pixel cursors", BufferResourceDescriptor.empty(
+        round_up(list_count * 4, 16),
+        GPUBufferUsage.STORAGE
+    ));
+    scatter_data.material_quads = scatter_pass.create("material quads", BufferResourceDescriptor.from(
+        round_up(width * height * 4, 16),
+        GPUBufferUsage.STORAGE
+    ));
+
+    // 5. shade
+    const shade_data = {};
+
+    const shade_pass = graph.add("Material dispatch / shade", shade_data, (data, resources, context) => {
+        const encoder = context.encoder;
+
+        const g_pbr = resources.get(data.g_pbr);
+        const g_normal = resources.get(data.g_normal);
+        const g_albedo = resources.get(data.g_albedo);
+        const g_emissive = resources.get(data.g_emissive);
+
+        const record_buffer = resources.get(data.records);
+
+        // the group 3s are made over the records' current buffer; a growth since this frame was
+        // recorded would leave them on a different one than the commands
+        assert.equal(record_buffer, records.buffer, 'the dispatch records were replaced between recording and executing the frame');
+
+        const bind_1 = bindings.obtain(BindGroupDescriptor.from(GBUFFER_COMPUTE_VIZ_LAYOUT, [
+            resources.get(data.viz_triangle).obtainView(),
+            resources.get(data.viz_mesh).obtainView(),
+            { buffer: view.uniform_buffer.buffer },
+            { buffer: view.camera.buffer.buffer },
+            { buffer: resources.get(data.material_quads) },
+            g_pbr.obtainView(),
+            g_normal.obtainView(),
+            g_albedo.obtainView(),
+            g_emissive.obtainView(),
+        ]));
+
+        const bind_2 = bindings.obtain(BindGroupDescriptor.from(GBUFFER_COMPUTE_SCENE_LAYOUT, [
+            { buffer: view.scene.scene_database_buffer },
+            { buffer: view.scene.geometries.buffer_metadata },
+            { buffer: view.scene.geometries.meshlets.buffer_metadata },
+            { buffer: view.scene.geometries.meshlets.buffer_data },
+        ]));
+
+        const pass = encoder.beginComputePass({ label: "Material dispatch / shade" });
+
+        pass.setBindGroup(1, bind_1);
+        pass.setBindGroup(2, bind_2);
+
+        let bound_pipeline = null;
+
+        for (let slot = 0; slot < slot_count; slot++) {
+            const material_ctx = contexts[slot];
+
+            const pipeline = pipeline_of(material_ctx);
+
+            if (pipeline !== bound_pipeline) {
+                pass.setPipeline(pipeline);
+
+                bound_pipeline = pipeline;
+            }
+
+            pass.setBindGroup(0, group_of(material_ctx));
+            pass.setBindGroup(3, records.bind_group(slot));
+
+            pass.dispatchWorkgroupsIndirect(record_buffer, slot * MATERIAL_DISPATCH_RECORD_STRIDE);
+        }
+
+        pass.end();
+    });
+
+    shade_data.viz_triangle = shade_pass.read(texture_viz_triangle);
+    shade_data.viz_mesh = shade_pass.read(texture_viz_mesh);
+    shade_data.material_quads = shade_pass.read(scatter_data.material_quads);
+    shade_data.records = shade_pass.read(commands_data.records);
+    shade_data.g_pbr = shade_pass.write(shade_pass.read(count_data.g_pbr));
+    shade_data.g_normal = shade_pass.write(shade_pass.read(count_data.g_normal));
+    shade_data.g_albedo = shade_pass.write(shade_pass.read(count_data.g_albedo));
+    shade_data.g_emissive = shade_pass.write(shade_pass.read(count_data.g_emissive));
+
+    return {
+        g_pbr: shade_data.g_pbr,
+        g_normal: shade_data.g_normal,
+        g_albedo: shade_data.g_albedo,
+        g_emissive: shade_data.g_emissive,
+    };
+}

package/src/shade/renderer/material/dispatch/shader_material_dispatch_commands.d.ts

@@ -0,0 +1,16 @@
+/**
+ * @type {WebGPUStruct}
+ */
+export const MATERIAL_DISPATCH_COMMANDS_SETTINGS_STRUCT: WebGPUStruct;
+/**
+ * Write each material's {@link MATERIAL_DISPATCH_RECORD_STRUCT}: its run of the pixel list, from
+ * the inclusive sums of the (material, tile) counts, and the folded workgroup counts its dispatch is
+ * issued with — `(0, 1, 1)` for a material with no pixel on screen. One invocation per material,
+ * dispatched directly over the G-buffer pass's list.
+ *
+ * @type {ComputeShader}
+ */
+export const shader_material_dispatch_commands: ComputeShader;
+import { WebGPUStruct } from "../../shader/type/WebGPUStruct.js";
+import { ComputeShader } from "../../shader/ComputeShader.js";
+//# sourceMappingURL=shader_material_dispatch_commands.d.ts.map

package/src/shade/renderer/material/dispatch/shader_material_dispatch_commands.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"shader_material_dispatch_commands.d.ts","sourceRoot":"","sources":["../../../../../../src/shade/renderer/material/dispatch/shader_material_dispatch_commands.js"],"names":[],"mappings":"AAWA;;GAEG;AACH,yDAFU,YAAY,CAKiB;AAqDvC;;;;;;;GAOG;AACH,gDAFU,aAAa,CAMpB;6BA1E0B,mCAAmC;8BAJlC,+BAA+B"}