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:
- Registering loader plugins and glTF extensions for dynamic loading: Loading Any File Type | Babylon.js Documentation (babylonjs.com)
- Creating your own loader plugins that work with dynamic loading: Create Your Own File Importer | Babylon.js Documentation (babylonjs.com)
- Creating your own glTF extensions that work with dynamic loading: Babylon.js docs
Feel free to reply to this thread if you have any questions!