Loading gltf files that share SAME textures

[Rodrix3]

I have several gltf files that use the same textures.

Different materials, but same textures.

Unfortunately Babylon is not getting that the textures are the same, and thus it is loading the SAME jpg file about 10 times (when I load 10 gltf files that use that jpeg).
Since the textures are VERY big (4K resolution) this is making everything slower.

How could I solve this?
I cannot combine the multiple gltf files into one, as they are very heavy.

Thanks in advance!

[Sebavan]

ping @bghgary

[bghgary]

On ‎4‎/‎20‎/‎2018 at 5:27 PM, Rodrix3 said:

Unfortunately Babylon is not getting that the textures are the same, and thus it is loading the SAME jpg file about 10 times

@Rodrix3 It is true that the glTF loader will create texture objects each time a texture is referenced, but it should not reload the same image multiple times. The reason for creating multiple textures is to accommodate textureInfo properties (like coordinate index). Do you have a model you can share that I can investigate?

[Rodrix3]

HI @bghgary, thanks so much for the input!

Unfortunately the mesh that I am working with too big (almost 600 mb or more!).

In 3ds Max I have multiple materials, each material uses the same 3 textures (diffuse, roughness, metalness), and a different ambient occlusion texture.
This means that at least 10 materials share the same textures (diffuse, roughness, metalness), but different ambient occlusion texture.

Now, when I export these 10 different gltf files, the 3 textures that the 10 materials have in common, are loaded per every gltf file.
This means, that the 3 textures are loaded x10 times. This means having 30 textures loaded, instead of 3. (...and I am using 8000x8000 textures)

I am thinking that the only way to solve this is to export everything with the same material from 3ds Max, and then do an override on mesh load,
and thus ensuring that the textures are loaded just once, and used multiple times.

What do you think?
Thanks in advance!
 

[bghgary]

9 hours ago, Rodrix3 said:

Now, when I export these 10 different gltf files, the 3 textures that the 10 materials have in common, are loaded per every gltf file.
This means, that the 3 textures are loaded x10 times. This means having 30 textures loaded, instead of 3.

Ahh, different glTF files. Yes, that doesn't instance right now because the loader creates a blob url in the loader. I will try to fix this when https://github.com/BabylonJS/Babylon.js/issues/4145 is fixed. It should make it such that images with the same url will only be loaded once.

[Rodrix3]

On 4/25/2018 at 2:34 PM, bghgary said:

Ahh, different glTF files. Yes, that doesn't instance right now because the loader creates a blob url in the loader. I will try to fix this when https://github.com/BabylonJS/Babylon.js/issues/4145 is fixed. It should make it such that images with the same url will only be loaded once.

Is there a way so I can use the  assetsManager.addMeshTask("Model", "", "assets/models/", "_model.gltf"); and AVOID loading the textures, so I can load them manually?
This would be the best at this point. I need to load a gltf mesh WITHOUT the material. I will create the material manually.

Is it possible to do this?

Thanks

[bghgary]

14 hours ago, Rodrix3 said:

I need to load a gltf mesh WITHOUT the material

I can think of a few hacky ways to do it, but I don't recommend any of them.

Can you export the files without the texture/material?

I will try to fix the 4145 issue as soon as I can so that you don't have to do this.

[Rodrix3]

15 minutes ago, bghgary said:

I can think of a few hacky ways to do it, but I don't recommend any of them.

Can you export the files without the texture/material?

I will try to fix the 4145 issue as soon as I can so that you don't have to do this.

Maybe i can modify the gltf files manually... However I am not sure if I can set "no material".

I was thinking of:

 

let task = assetsManager.addMeshTask(taskName, meshesNames, rootUrl, "sceneFilename");
                task.onSuccess = function (task) {  
                    task.loadedMeshes.forEach(function(mesh){
          
                        //If not a group, and we need to override the material
                        if(mesh.material && settings.material){
                            let materialToDelete = mesh.material;
                            mesh.material = null;
                            materialToDelete.dispose();
                            scene.resetCachedMaterial(); //Not sure if this line is necessary
                            mesh.material =newMaterial
                        }
                                                 
                    });
                }      

 

..what do you think?                 

Thanks in advance

[bghgary]

You can certainly override the materials afterwards, but it doesn't stop the loading of the textures.

Manually modifying the glTF files to remove the references to the materials is relatively straight forward. Just search for "material": <index> and remove all of them. This can be done with code as well via the SceneLoader.OnPluginActivatedObservable and the loader's onParsedObservable which gives you access to the JSON before it is loaded.

[Rodrix3]

@bghgary, I am having a really hard time..
I think I will have to wait till you fix the bugs.

This is what I see in additional:

• If ambient texture, albedo, metallicRoughness texture point to the texture index, STILL Babylon is loading 3 different textures.
  That should not happen.
  
  

[bghgary]

@Rodrix3 What you are seeing is by design. Babylon stores certain properties on the texture object that cannot be shared and thus the loader creates a new instance of the texture object for each reference to a texture. The underlying internal texture storing the actual image data will be shared based on the URL of the texture.

[bghgary]

This PR should fix the issues you are having with loading multiple glTF assets pointing to the same textures.