Appearance
Assets and model files
GLB
GLB is the easiest deployment format because geometry, animation, and textures can be contained in one file.
tsx
<ModelLabViewer src="/models/chair.glb" />GLTF with external resources
A .gltf file may refer to files such as scene.bin and textures/baseColor.png. In the editor, select the complete set or open the containing folder. The loader builds an object-URL map that preserves referenced relative paths.
In production, deploy the folder structure unchanged or pass resourcePath when dependencies are served from a different base path.
tsx
<ModelLabViewer
src="/models/machine/scene.gltf"
resourcePath="/models/machine/"
/>Compressed assets
- Draco-compressed geometry uses
dracoDecoderPath. - Meshopt-compressed assets are decoded by the bundled Meshopt decoder.
- KTX2/Basis textures are not yet part of the built-in runtime and require a custom loader integration.
Cross-origin resources
Remote assets must allow browser access through CORS. A model can load while one of its external textures fails, so handle both onError and onTextureError.
Asset naming
Stable mesh and material names improve exported material override matching. Avoid duplicate names where possible. The export also records mesh indices and UUIDs, but UUIDs can change when an asset is re-exported.
Optimization checklist
- Remove unused nodes and materials.
- Merge static meshes where it reduces draw calls without damaging culling.
- Compress geometry and textures.
- Use sensible texture dimensions.
- Keep animation clips purposeful.
- Test on the lowest-powered target device.