The glTF optimization process and how to change the glTF image URI at runtime

Sharing experience of optimizing gltf using several command line tools.

The tool I used is below.

As a result, it has been optimized to about 1/4 the size of the original. This greatly reduced the loading time and especially the ktx2 compression saved a lot of GPU memory. (The crash on mobile has been resolved after application.)

I created an automatic optimization process by linking each optimization process with Python code, and with one command, we were able to create optimized assets for each quality level version as shown below.


What I would most like to share is that gltf texture uri can be changed at runtime

SceneLoader.OnPluginActivatedObservable.add((loader) => {
  const gltfLoader = loader as unknown as GLTFFileLoader;
  gltfLoader.onParsed = (data) => {
    // @ts-ignore
    const images: IImage[] = data.json['images'];
    for (const image of images) {
      if (image.uri) {
        // textureMaxSize : 256, 512 ...
        image.uri = `${textureMaxSize}/${image.uri}`;

In this way, when loading a gltf/glb file, you can receive data through the onParsed event and change the uri at runtime. Even if it’s not an image uri, being able to modify the loading gltf/glb without creating a separate loader at runtime is useful and intriguing in many ways.

const src = `/assets/model${suffix}.glb`
await SceneLoader.ImportMeshAsync('', src);

Also, it was useful to load modeling extracted by quality level like this.

Through this optimization process, we have been able to select and load models and images at runtime according to quality settings, and we plan to load them according to the user device class in the future.

It’s not enough, but I share the optimization tool I made in the path below. I plan to deploy to Docker in the future, so if you are interested, please give us your opinion about the tool.

I hope it is useful to you.


Nice one !!! @PatrickRyan I wonder if we have a topic about this in the doc we could consolidate ?