Dynamically imported scene loader plugins and glTF extensions

Hey folks - it is now possible to have scene loader plugins (e.g. for .glb, .splat, .obj, and .stl) be dynamically imported at runtime only at the moment they are needed. Additionally, the same goes for glTF extensions.

For example, if you know that you want your web app to support all the file formats that Babylon.js supports, as well as all glTF extensions, but you don’t want the end user to pay the cost of downloading the code until needed, this can now easily be configured. This can make it faster to get something painted to the screen, and reduce hosting costs.

To keep backward compatibility, this does require small changes to code using the Babylon.js API. Specifically, you can now do this:

import { loadAssetContainerAsync } from "@babylonjs/core/Loading/SceneLoader";
import { registerBuiltInLoaders } from "@babylonjs/loaders/dynamic";
...
registerBuiltInLoaders();
...
loadAssetContainerAsync(...);

This is a replacement for code that previously would have looked like this:

import { loadAssetContainerAsync } from "@babylonjs/core/Loading/SceneLoader";
import "@babylonjs/loaders/glTF/2.0";
import "@babylonjs/loaders/OBJ";
...
loadAssetContainerAsync(...);

Note that registerBuiltInLoaders registers all the loaders supported by Babylon.js, as well as all glTF extensions. However as mentioned, the actual loaders and extensions are dynamically imported at the moment we find that they are needed to load an asset.

It’s difficult to demo this in the Playground because the Playground implicitly brings in all loaders and glTF extensions statically, but you can find more details in the docs:

Feel free to reply to this thread if you have any questions!

5 Likes