Something huge is coming to Threejs. Today I achieved an N-tile shadow render in a single draw call using RenderBundle, Depth 2D Array FBO, and CameraArray. Basically, here one draw call and one command renders and stores shadows for 16 different parts of the scene. - ThreadSky

renaudrohlinger.com • 55 days ago

Something huge is coming to Threejs. Today I achieved an N-tile shadow render in a single draw call using RenderBundle, Depth 2D Array FBO, and CameraArray.

Basically, here one draw call and one command renders and stores shadows for 16 different parts of the scene.

Comments

renaudrohlinger.com•55 days ago

To better explain, here the left scene renders classic shadows with a single 4K shadow render in 2ms.

On the right, a real-time 16K split in 16 sections shadow map takes an extra 4ms. Now consider this technology with CSM and dynamic tiling logic.

From 16 to 268 millions px!🤩

renaudrohlinger.com•55 days ago

Rendering a 16k shadow map wouldn't even be possible to do in web. You would hit the 8k limit.

And trying to tile the classic way would require rendering the scene 16 times, not to mention the bind limit of 16 samplers per shader stage, which would conflict with other maps.

renaudrohlinger.com•55 days ago

Just realized I was initially just frustrated with the quality and performance of my shadows.

I went way too far, lol.

renaudrohlinger.com•55 days ago

Now time to add this improvement to WebGL too. The current state doesn't look so bad, so it might be easy. 😅

martin-laxenaire.fr•55 days ago

So you're rendering a big shadow map splitted in a depth textures array of depth 16?
Then the idea for CSM would be to split it into like 4 depth textures arrays of decreasing width and height, based on the distance to the camera?

martin-laxenaire.fr•55 days ago

But I don't get how you can do it in a single pass. I still need 6 render passes to render point shadows to the cube depth textures for example. 🤔

renaudrohlinger.com•55 days ago

You don’t need to re-render the whole scene. Key part is just rebinding the shadow camera UBO between draws and render only once. And like well explained by @gnikoloff.bsky.social you can bundle draw.
Also I think CSM just renders four 4K maps with incrementally increasing surface coverage, so same.

martin-laxenaire.fr•54 days ago

Hmm, ok, but since multi view is not yet supported, that means you're creating 16 render passes (one for each depth layer) and executing your bundle 16 times, right?

renaudrohlinger.com•54 days ago

If by render your mean draw operation, yes, I do draw 16 times each object.

martin-laxenaire.fr•54 days ago

By render passes I mean 'beginRenderPass' calls :)

Anyway I got you now, thanks for the explanation (and thanks to @gnikoloff.bsky.social as well).

Using render bundles for shadow maps has been on my to-do list for a while. I definitely need to try that.

georgi-nikolov.com•55 days ago

WebGPU render bundles allow you to record a draw call and replay it later on with different tweaks, e.g. different view matrices. So ultimately you issue one draw call.

You can achieve this with vertex amplification as well, which WebGPU sadly does not support AFAIK.

https://toji.dev/webgpu-best-practices/render-bundles.html

Comments

Posting Rules

Reply