Your 3D artist just sent you a Dropbox link. Inside is a 47MB GLB file that's supposed to be your product's hero model. You drop it into your Three.js scene and watch your loading spinner run for 15 seconds. On mobile, it never loads at all - the browser just gives up.
This is the reality of 3D on the web. The models that look incredible in Blender are often completely unusable in a browser. And somewhere between "this looks amazing" and "this actually loads," you're stuck doing the optimization work that nobody warned you about.
Why GLB Files Get So Large
Before we fix the problem, let's understand why it happens. GLB file size comes from three sources:
- Geometry - Polygon count. A photogrammetry scan can easily have 2 million triangles. A CAD export might have 500,000. For web delivery, you often need under 50,000.
- Textures - This is usually the biggest culprit. A single 4K texture is 16MB uncompressed. Artists often include 4-6 textures per material: diffuse, normal, roughness, metalness, AO, and emissive.
- Embedded Data - Animation data, morph targets, and multiple LOD levels all add size.
The good news: most of this can be reduced without visible quality loss. The bad news: doing it manually is tedious.
The Manual Approach (Blender)
If you're comfortable with Blender, here's the standard workflow:
Step 1: Reduce Polygon Count
Import your model, select the mesh, and apply a Decimate modifier. Start with a ratio of 0.5 (50% reduction) and preview the result. For organic models, the Collapse method works well. For hard-surface models like products, try Planar with a low angle limit.
# Blender Python - apply decimate
import bpy
obj = bpy.context.active_object
mod = obj.modifiers.new(name="Decimate", type='DECIMATE')
mod.ratio = 0.3 # 70% reduction
bpy.ops.object.modifier_apply(modifier="Decimate")
Step 2: Resize Textures
Open each texture in an image editor. Most web models don't need textures larger than 1024x1024. Some can get away with 512x512. Resize them all, being careful to maintain the naming conventions so Blender can still find them.
Step 3: Re-export with Draco Compression
When exporting to GLB, enable Draco mesh compression in the export settings. This can reduce geometry data by 90% with minimal quality loss.
Total time for one model: 30-60 minutes if you know what you're doing. Multiply that by 50 product SKUs and you've got a serious bottleneck.
The Automated Approach (API)
Here's the same workflow as a single API call:
curl -X POST https://webdeliveryengine.com/optimize \
-H "Authorization: Bearer sk_your_key" \
-F "file=@product-model.glb" \
-F "mode=decimate" \
-F "ratio=0.5" \
--output optimized.glb
That's it. The API handles polygon reduction, texture optimization, and Draco compression automatically. A 47MB file becomes 3MB. The whole process typically takes seconds to a few minutes depending on file size and complexity.
For batch processing, you can loop through a directory:
#!/bin/bash
for file in ./models/*.glb; do
curl -X POST https://webdeliveryengine.com/optimize \
-H "Authorization: Bearer sk_your_key" \
-F "file=@$file" \
-F "mode=decimate" \
-F "ratio=0.5" \
--output "./optimized/$(basename $file)"
done
Choosing the Right Quality Level
The ratio parameter (0.0-1.0) controls the polygon reduction ratio. Here's what we've found works well:
- 80-100% - Minor cleanup. Good for already-optimized models that just need a slight trim.
- 50-80% - Standard web optimization. Maintains visual quality while hitting web performance targets.
- 20-50% - Aggressive reduction. For thumbnails, distant objects, or mobile-first experiences.
- Under 20% - Extreme. Only for silhouettes or placeholder geometry.
For most e-commerce and product visualization use cases, 50% quality gives you the best balance. The model is visually indistinguishable from the original at typical viewing distances.
When to Use Remesh Instead
Decimation works by removing vertices while trying to preserve the shape. It's fast but can produce messy topology. For hero assets where you need clean geometry - models that will be animated, or that need perfect edge flow for subdivision - consider remeshing instead.
Remeshing rebuilds the entire mesh with clean quad topology. It takes longer but produces better results for complex organic shapes like characters or scanned objects.
curl -X POST https://webdeliveryengine.com/optimize \
-H "Authorization: Bearer sk_your_key" \
-F "file=@character.glb" \
-F "mode=remesh" \
-F "faces=5000" \
--output character-optimized.glb
Performance Targets for Web 3D
Here are the benchmarks we recommend for smooth 60fps performance:
| Target | Desktop | Mobile |
|---|---|---|
| Total Triangles | < 500,000 | < 100,000 |
| Single Model Triangles | < 100,000 | < 30,000 |
| Texture Size | 2048x2048 max | 1024x1024 max |
| Total File Size | < 20MB | < 5MB |
| Draw Calls | < 100 | < 50 |
Use our GLB Inspector to check your models against these targets before deployment.
Summary
Large GLB files kill web 3D experiences. The fix is straightforward: reduce polygons, compress textures, enable Draco. You can do this manually in Blender, spending 30-60 minutes per model, or you can automate it with an API call that takes seconds to minutes.
If you're dealing with more than a handful of models, automation isn't just convenient - it's the only way to ship on time.