Single-pass IBL shadow voxelization for WebGPU #17270

MiiBond · 2025-10-10T18:15:08Z

This changes the voxelization strategy for WebGPU to allow it to be done in a single pass (though, generation of mips still takes additional steps). This is possible using textureStore to write to arbitrary texels in a 3D texture. It also uses vertex pulling to correctly determine the provoking vertex for each triangle and retrieve adjacent vertices so that we can calculate the triangle's normal. This is used to swizzle the xyz components to maximize the rasterized area and not miss voxels.

Anywho, this makes updating shadows for animated meshes much more plausible. I'm not sure the best way to do this but currently, in my playground, I'm doing this:

const frameSkip = 1;
let frame = 0;
scene.onAfterAnimationsObservable.add(() => {
    if (enableIblShadows) {
        if (frame == 0 && scene.animatables.find((anim) => !anim.paused)) {
            iblShadowsPipeline.updateVoxelization();
            iblShadowsPipeline.resetAccumulation();
        }
        if (frame === frameSkip) {
            frame = 0;
        } else {
            frame++;
        }
    }
});

Is there a better way to query whether there is currently an animation happening?

bjsplat · 2025-10-10T18:16:38Z

Please make sure to label your PR with "bug", "new feature" or "breaking change" label(s).
To prevent this PR from going to the changelog marked it with the "skip changelog" label.

bjsplat · 2025-10-10T18:30:54Z

Snapshot stored with reference name:
refs/pull/17270/merge

Test environment:
https://snapshots-cvgtc2eugrd3cgfd.z01.azurefd.net/refs/pull/17270/merge/index.html

To test a playground add it to the URL, for example:

https://snapshots-cvgtc2eugrd3cgfd.z01.azurefd.net/refs/pull/17270/merge/index.html#WGZLGJ#4600

Links to test babylon tools with this snapshot:

https://playground.babylonjs.com/?snapshot=refs/pull/17270/merge
https://sandbox.babylonjs.com/?snapshot=refs/pull/17270/merge
https://gui.babylonjs.com/?snapshot=refs/pull/17270/merge
https://nme.babylonjs.com/?snapshot=refs/pull/17270/merge

To test the snapshot in the playground with a playground ID add it after the snapshot query string:

https://playground.babylonjs.com/?snapshot=refs/pull/17270/merge#BCU1XR#0

bjsplat · 2025-10-10T18:37:18Z

Interaction tests

https://snapshots-cvgtc2eugrd3cgfd.z01.azurefd.net/refs/pull/17270/merge/testResults/interactionplaywright/index.html

bjsplat · 2025-10-10T18:44:27Z

WebGL2 visualization test reporter:

https://snapshots-cvgtc2eugrd3cgfd.z01.azurefd.net/refs/pull/17270/merge/testResults/webgl2playwright/index.html

bjsplat · 2025-10-10T18:49:25Z

Devhost visualization test reporter:

https://snapshots-cvgtc2eugrd3cgfd.z01.azurefd.net/refs/pull/17270/merge/testResults/devhostplaywright/index.html

bjsplat · 2025-10-10T19:06:49Z

Visualization tests for WebGPU

https://snapshots-cvgtc2eugrd3cgfd.z01.azurefd.net/refs/pull/17270/merge/testResults/webgpuplaywright/index.html

Popov72 · 2025-10-13T08:39:58Z

This changes the voxelization strategy for WebGPU to allow it to be done in a single pass (though, generation of mips still takes additional steps). This is possible using textureStore to write to arbitrary texels in a 3D texture. It also uses vertex pulling to correctly determine the provoking vertex for each triangle and retrieve adjacent vertices so that we can calculate the triangle's normal. This is used to swizzle the xyz components to maximize the rasterized area and not miss voxels.

Anywho, this makes updating shadows for animated meshes much more plausible. I'm not sure the best way to do this but currently, in my playground, I'm doing this:
const frameSkip = 1;
let frame = 0;
scene.onAfterAnimationsObservable.add(() => {
    if (enableIblShadows) {
        if (frame == 0 && scene.animatables.find((anim) => !anim.paused)) {
            iblShadowsPipeline.updateVoxelization();
            iblShadowsPipeline.resetAccumulation();
        }
        if (frame === frameSkip) {
            frame = 0;
        } else {
            frame++;
        }
    }
});
Is there a better way to query whether there is currently an animation happening?

In a real-world scenario, I think we would let the user decide when to update the voxelization (meshes can also be moved without using animation, a custom vertex shader can apply deformation, etc.). But for a test PG, I think this is fine.

Let us know when the PR is ready for review!

bjsplat · 2025-10-17T21:30:04Z

Interaction tests

https://snapshots-cvgtc2eugrd3cgfd.z01.azurefd.net/refs/pull/17270/merge/testResults/interactionplaywright/index.html

bjsplat · 2025-10-17T21:33:17Z

Devhost visualization test reporter:

https://snapshots-cvgtc2eugrd3cgfd.z01.azurefd.net/refs/pull/17270/merge/testResults/devhostplaywright/index.html

bjsplat · 2025-10-17T21:36:43Z

Visualization tests for WebGPU

https://snapshots-cvgtc2eugrd3cgfd.z01.azurefd.net/refs/pull/17270/merge/testResults/webgpuplaywright/index.html

bjsplat · 2025-10-17T21:38:32Z

WebGL2 visualization test reporter:

https://snapshots-cvgtc2eugrd3cgfd.z01.azurefd.net/refs/pull/17270/merge/testResults/webgl2playwright/index.html

Popov72 · 2025-10-20T09:34:33Z

packages/dev/core/src/Rendering/IBLShadows/iblShadowsVoxelRenderer.ts

+                if (this._engine.isWebGPU) {
+                    // Clear the voxel grid storage texture.
+                    // Need to clear each layer individually.
+                    // Would a compute shader be faster here to clear all layers in one go?


A compute shader will likely be faster, as each layer clear generates a render pass:

Popov72 · 2025-10-20T09:45:55Z

packages/dev/core/src/ShadersWGSL/ShadersInclude/morphTargetsVertex.fx


 			#ifdef MORPHTARGETS_POSITION
+				#ifdef USE_VERTEX_PULLING
+				positionUpdated = positionUpdated + (readVector3FromRawSampler(i, vertexID) - inputPosition) * uniforms.morphTargetInfluences[i];


This change ties morphTargetsVertex.fx too closely to iblVoxelGrid.vertex.fx, because inputPosition is defined in the latter file, and we don't yet know how we're going to handle vertex pulling for our standard materials. In the meantime, check out my suggestion in iblVoxelGrid.vertex.fx to work around this issue.

Popov72 · 2025-10-20T09:47:59Z

packages/dev/core/src/ShadersWGSL/iblVoxelGrid.vertex.fx

+
+varying vNormalizedPosition : vec3f;
+flat varying f_swizzle: i32;
+varying vNormal : vec3f;


You can remove this declaration, as vNormal is not used.

Popov72 · 2025-10-20T09:51:24Z

packages/dev/core/src/ShadersWGSL/iblVoxelGrid.vertex.fx

+
+#include <morphTargetsVertexGlobal>
+let inputPosition: vec3f = positionUpdated;
+#include <morphTargetsVertex>[0..maxSimultaneousMorphTargets]


Instead of updating morphTargetsVertex.fx, you can modify this declaration as follows:

#include <morphTargetsVertex>("vertexInputs.position),inputPosition)")[0..maxSimultaneousMorphTargets]

This should (not tested!) replace the two occurrences of vertexInputs.position) with inputPosition), which will allow you to achieve the desired result without using inputPosition in morphTargetsVertex.fx.

@Popov72 The code, as given, has syntax errors in it (two ')' brackets without matching '('). However, I can't find examples of the expected syntax for this. Are there existing places in the code where this type of substitution happens?

Yes, it's on purpose :)

In the #include<XXX>("YYYY") syntax, the YYY part is a simple find and replace mechanism, where YYYY has this format: find1,replace1,find2,replace2,etc.

So, what I did is to replace vertexInputs.position) with inputPosition). I put the closing parenthesis in the string, else it does a replacement for an additional occurrence (vertexInputs.position{X}) that we don't want to update.

We use this syntax a lot in the PBR/OpenPBR/standard vertex shaders:

Mike Bond and others added 6 commits October 13, 2025 09:44

WIP single-pass voxelization via compute shader

dc34f10

WIP updating shaders for vertex pulling

fb77965

Fix voxel WebGPU compile issues

e423b55

WIP animated voxelization in WebGPU

f48f815

Remove changes to WebGPU vertex shaders

f97c3ec

Fix WebGPU first time voxelization

4775e9e

MiiBond force-pushed the mbond/single-pass-voxelization-via-compute branch from 2111655 to 4775e9e Compare October 17, 2025 21:07

MiiBond marked this pull request as ready for review October 17, 2025 21:11

sebavan requested a review from Popov72 October 17, 2025 22:26

Popov72 requested changes Oct 20, 2025

View reviewed changes

Single-pass IBL shadow voxelization for WebGPU #17270

Are you sure you want to change the base?

Single-pass IBL shadow voxelization for WebGPU #17270

Conversation

MiiBond commented Oct 10, 2025

Uh oh!

bjsplat commented Oct 10, 2025

Uh oh!

bjsplat commented Oct 10, 2025

Uh oh!

bjsplat commented Oct 10, 2025

Uh oh!

bjsplat commented Oct 10, 2025

Uh oh!

bjsplat commented Oct 10, 2025

Uh oh!

bjsplat commented Oct 10, 2025

Uh oh!

Popov72 commented Oct 13, 2025 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

bjsplat commented Oct 17, 2025

Uh oh!

bjsplat commented Oct 17, 2025

Uh oh!

bjsplat commented Oct 17, 2025

Uh oh!

bjsplat commented Oct 17, 2025

Uh oh!

Popov72 Oct 20, 2025

Choose a reason for hiding this comment

Uh oh!

Popov72 Oct 20, 2025

Choose a reason for hiding this comment

Uh oh!

Popov72 Oct 20, 2025

Choose a reason for hiding this comment

Uh oh!

Popov72 Oct 20, 2025

Choose a reason for hiding this comment

Uh oh!

MiiBond Oct 20, 2025

Choose a reason for hiding this comment

Uh oh!

Popov72 Oct 20, 2025 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

3 participants

Popov72 commented Oct 13, 2025 •

edited

Loading

Popov72 Oct 20, 2025 •

edited

Loading