Best way to fully clone a Babylon.js scene for GLTF export (including hierarchy and textures)?

Questions
1

Hi,

I’m trying to create a full copy of an existing Babylon.js scene in order to modify it and export it to GLTF without affecting the original scene.

:bullseye: Goal

  • Clone the entire scene (nodes, meshes, hierarchy, lights, cameras)

  • Keep materials and textures shared or reused (no deep copy needed)

  • Preserve complex hierarchy (including nested nodes and InstancedMesh)

  • Ensure textures are correctly exported into GLTF (images section is not empty)

:cross_mark: Problems I encountered

1. Manual deep clone

I tried implementing my own recursive clone:

  • cloning TransformNode, Mesh, InstancedMesh, etc.

  • restoring parent hierarchy

But:

  • very slow with large scenes (~48k nodes)

  • breaks hierarchy in some cases (especially cabinets with nested nodes)

  • InstancedMesh depends on cloning order

  • hard to maintain correctness

2. SceneSerializer + SceneLoader

I also tried:

const serialized = BABYLON.SceneSerializer.Serialize(scene);
const json = JSON.stringify(serialized);
const url = "data:application/json," + encodeURIComponent(json);

const newScene = await BABYLON.SceneLoader.LoadAsync("", url, engine);

This works much better for hierarchy, but I had issues where:

  • textures were not always present in GLTF export (images array empty)

  • likely because export was triggered before textures finished loading

:red_question_mark: Questions

  1. What is the recommended way to fully clone a scene in Babylon.js for export purposes?

    • Is SceneSerializer + SceneLoader the correct approach?

  2. Is there any built-in or recommended pattern to:

    • duplicate a scene without modifying the original

    • while keeping performance reasonable?

  3. What is the correct way to ensure that:

    • all textures are fully loaded before calling GLTF2Export.GLTFAsync(...)?

  4. Are there any known pitfalls when cloning scenes with:

    • InstancedMesh

    • complex transform hierarchies

    • PBR materials with textures?

:light_bulb: Current approach

Right now I:

  • clone scene via SceneSerializer + LoadAsync

  • await scene.whenReadyAsync()

  • wait for all textures via texture.onLoadObservable

  • then process scene and export

But I want to confirm if this is the correct and recommended approach.

Thanks in advance!

1 Like
2

I think some of the behaviors you are exposing are bugs mostly around the textures not being present in export. Could you share repro for them ?

cc @alexchuber

1 Like
3

public async createGltf(filename: string, scene?: BABYLON.Scene): Promise {

    await this.\_3dgo_prepareTool.prepareScene(scene);

    await this.\_3dgo_prepareTool.waitUntilReady();

    const exportScene = this.\_3dgo_prepareTool.get3DGOScene();

    return GLTF2Export.GLTFAsync(

        this.\_3dgo_prepareTool.get3DGOScene(),

        filename,

        {

            shouldExportNode: (node) => node.isEnabled()

    }

    );

}

Scene clone class

1 Like
4

Can you repro in the playground as I am afraid it would depend on the actual scene unfortunately

1 Like