WEBGPURender: GLTF mesh is destroyed

[niuin]

Description

Loading a GLTF model using WebGPURenderer may result in mesh corruption.

The test GLTF was created in Blender.
Only eyes, eyelashes and eyebrows are animated in this GLTF.
( Minimal drawing to find the cause )
https://niuind.com/t/output.glb
https://niuind.com/t/20250224bugreport.blend

GLTF Viewer and other software shows it correctly.
https://gltf-viewer.donmccurdy.com/

Reproduction steps

1. Load the GLTF model using WebGPURenderer.
2. View the model in a web browser to see the mesh damage.
   (For some reason, it seems to be displayed correctly on cell phone browsers.)

Code

                    const loader = new GLTFLoader( manager );
                    // loader.setMeshoptDecoder( MeshoptDecoder );
                    loader.load( fileNameArray[randomIndex][0], function ( gltf ) {

                        mesh = gltf.scene;

                        scene.add( mesh );
                        mixer = new THREE.AnimationMixer( mesh );
                        for (let i = 0; i < gltf.animations.length; i++ ) {
                            mixer.clipAction( gltf.animations[ i ] ).play();
                        };
                    }, onProgress );

renderer = new THREE.WebGPURenderer( { antialias: true, powerPreference: "high-performance", logarithmicDepthBuffer: "true", reverseDepthBuffer: "true" } );

Live example

WebGPURenderer
https://niuind.com/t/gltftest_webgpu.html

WebGLRenderer
https://niuind.com/t/gltftest_webgl.html

Screenshots

Version

r173

Device

Desktop

Browser

Chrome

OS

Windows

[Mugen87]

I wasn't able to download the GLB from your provided link (timeout). Do you mind sharing the source + asset as a GitHub repo?

[niuin]

I don't usually use github, so I don't know how to use it, but can I check the files with this?
https://github.com/niuin/fileupload/tree/main

[Mugen87]

I can confirm the bug. The WebGL backend is fine though so only WebGPU is affected.

[Mugen87]

Maybe this issue is related to your skeleton which has 562 bones. Putting this number of mat4 into a UBO probably exceeds the supported size. I wonder why it works with WebGL 2 though 🤔 .

@niuin Can you try to lower the number of bones until the skinned mesh works? It would be interesting to know the exact threshold.

[niuin]

Thanks for checking.

You are correct, there are 562 bones in this armature.

I checked the thresholds and it seems that the results are different depending on the bones to be removed.

I got two results with 485 bones as one borderline.

Bone A (no mesh collapse, one parent removed)
https://niuind.com/t/gltftest_webgpu_boneA.html

Bone B (with mesh failure, one parent added)
https://niuind.com/t/gltftest_webgpu_boneB.html

In this image, the results changed depending on the presence or absence of the parent in the red circle.

BoneA with Bone parent removed,
BoneB with Bone parent added.

I have uploaded the two GLBs and the .blend additionally.
Hope this gives you some idea.

[niuin]

After some further checking, it seemed that in some cases, no matter how many bones were removed, there was no improvement.

This is a setting on the Blender side, but for some reason, when I enabled the Add LeafBones option, a perfect mesh was displayed.

Live Sample
https://niuind.com/t/gltftest_webgpu_leafbone.html
( GLB has been uploaded. )

Maybe this has something to do with it?
KhronosGroup/glTF-Blender-IO#1261