Error with the GLTFLoader unable to load texture blob

We are having a problem with an application that we are building. This application consists of several scenes that we instantiate dynamically using React. Basically you do a chapter, then we change routes and a new React component loads the next chapter. The first time around works perfectly, but if the users wants to repeat one of the chapters the browser crashes completely. We managed to capture the console output and apparently the GLTFLoader is trying to load a blob from an address containing a UUID that doesn’t exist.This problem only happens on Android.
Sounds to me like some internal caching issue. Btw we do have the THREE.Cache.enabled set to false because turning it true would cause problems in iOS.

I think the problem may have to do with the textureCache inside the GLTFParser. Is it possible to reinitialize this? I couldn’t find anything in the source. Or maybe it’s something else entirely.

Any ides would be welcomed, thanks

GLTFLoader creates a new GLTFParser each time it loads a model, so the caches should be isolated here.

Are the textures in this model using PNG/JPEG, or KTX2 formats?

If there’s some way to share a demo that may help; I’m not sure what might be going on here.

Thanks for the input.
The textures are PNG/JPEG. Sharing a demo is kind of hard because of client constraints, but from what you are saying I think that the problem may be that I am somehow retaining an instance of the GLTFLoader which is then used when returning to the chapter. Since I am clearing the textures manually as soon as a chapter is closed, there may be conflict here. The strange thing is that I am creating a new instance of the GLTFLoader for each glb file that I load. I guess that this is how it is expected to be used right?
Do you think adding a dispose method to the GLTFLoader would be helpful? Anyways I will get right to it.
Thanks a lot for your help and the great work moving glTF forward.

1 Like

I don’t think there’s anything for GLTFLoader to dispose – it doesn’t reuse its GLTFParser instances ever. Normally I would advise reusing the loader like you’re doing. If you’re using DRACOLoader or KTX2Loader (registered with GLTFLoader) you could try disposing and replacing those.

To get it to work reliably I had to force the GLTFLoader to use the regular TextureLoader instead of the ImageBitmapLoader by doing the following very ugly hack of calling the following before starting loading:
window.createImageBitmap = undefined
The ImageBitmapLoader seems to have problems with releasing memory. I will try to investigate further on the weekend.
If I am not mistaken this has been reported elsewhere in relation to iOS. Well it seams that Android is also having a problem.

Related: GLTFLoader: Provide option to disable ImageBitmapLoader by donmccurdy · Pull Request #22975 · mrdoob/three.js · GitHub

1 Like

Hi everyone,

I’m encountering an issue while trying to render a 3D model using THREE.GLTFLoader in my React Native application. Here’s a brief overview of the problem:

Issue:

I receive the following error when attempting to load a GLTF model:
ERROR THREE.GLTFLoader: Couldn’t load texture blob:673fc084-dfdb-456f-aa8c-c55186db8398?offset=0&size=13856

LOG EXGL: gl.pixelStorei() doesn’t support this parameter yet!

I’m also attaching the resources:
Environment: Expo
React Three Fiber React Native documentation
Library Docs: Installation - React Three Fiber
Code: GitHub - wass08/r3f-wawa-eats
Video: https://www.youtube.com/watch?v=oCU5j5P20To