WebGPURenderer: instance mesh use binding group instead of attribute #28726
Conversation
![github-advanced-security[bot]](https://avatars.githubusercontent.com/in/57789?s=60&v=4){kind=small}
z4122
changed the title
|
@sunag @RenaudRohlinger Please review this PR |
|
Initially we used binding buffer, but the size was very limited, I think having both options is great. |
|
Can I merge this PR or you think on doing some other revision? |
Please review again. I found that WebGPU also limits uniform buffer max size https://www.w3.org/TR/webgpu/#dom-supported-limits-maxuniformbufferbindingsize. And the data in the uniform buffer must be aligned to 16 bytes. Since InstanceColor is a vec3 and occupies 12 bytes, I removed the optimization for InstanceColor. If I change instanceColor to vec4 in InstanceMesh.js, it will affect a lot of code. Therefore, I want to run a benchmark to determine if change instanceColor is worthwhile in another PR. |
📦 Bundle sizeFull ESM build, minified and gzipped.
🌳 Bundle size after tree-shakingMinimal build including a renderer, camera, empty scene, and dependencies.
|
|
@sunag I have solved code confit, please review again. Thanks! |
Description
Make instance objects use binding group instead of attribute
For instancing, it is preferable to use binding group buffers rather than attributes. I know in the initial versions of Three.js, uniforms had size limitations, leading to the use of attributes as a workaround.
However, WebGPU recommends using binding groups to pass values to the GPU. This approach eliminates the need for additional computations.
Before
After
In WebGL2, we can use UBOs (Uniform Buffer Objects) to achieve the same functionality. However, UBOs have a size limit of 64kB in spec. To accommodate this limitation, I restrict the instance count, allowing the application to run under different conditions with varying counts. (In fact, I found that the UBO max size is far more than 64kb in my device.)
Before
After
