A model built for offline rendering is usually far too heavy for a website. This guide prepares a model for glTF/GLB viewers — the standard format for 3D on the web — so it loads quickly on a phone and still looks right.
Step by step
Check scale and orientation
glTF uses metres and a Y-up axis. Apply transforms and scale before export, so the model arrives at the right size and the right way up.
Reduce the geometry
Decimate or retopologise to a triangle budget that suits your target devices, and bake high-poly detail into a normal map.
Merge meshes and materials
Every mesh–material pair is a draw call. Combine parts that share a material, and remove geometry that is never visible.
Use metal/roughness PBR textures
glTF’s material model is metallic-roughness. Pack occlusion, roughness and metallic into one texture (red, green and blue channels) and keep most maps at 1K–2K.
Export GLB
Export binary glTF (.glb) so geometry, textures and animation travel in a single file. In Blender: File › Export › glTF 2.0, with the glTF Binary format and Apply Modifiers enabled.
Compress
Apply Draco or meshopt compression to geometry and KTX 2.0 (Basis Universal) to textures. Tools such as glTF-Transform and gltfpack handle both.
Validate and test
Run the file through the Khronos glTF Validator, then test it in a real viewer on a mid-range phone — not only on your workstation.
Budgets to watch
- File size — what the visitor actually downloads.
- Draw calls — the fastest way to lose frame rate on mobile.
- Texture memory — usually the first limit a phone hits.
- Time to first frame — how long the visitor waits before seeing the model.
Test your GLB in the ZIBADIS 3D viewer or slim it down with the optimizer. For the bigger picture, read Real-time 3D on the web with WebGPU.
