Compress any GLB 3D model — drop a file, see it side-by-side in Three.js, and download a lighter asset ready for games, apps, AR/VR, or the web.

Real-world result from the tool:

58.3 MB → 869 KB · −99% smaller
1.91M triangles → 170.5k triangles · Draco geometry + WebP textures

AI-generated and scanned 3D models often ship at 5–60+ MB with hundreds of thousands to millions of triangles. That is fine for offline tools, but too heavy for real-time projects — games, interactive apps, AR experiences, and the web.

GLB Shrink turns bloated GLBs into lighter, production-ready assets in seconds — with a live before/after preview so you can actually see what you are getting.

No Blender. No command line. No guesswork.

• Drag & drop any .glb file (up to 200 MB)
• Instant before / after 3D preview with orbit controls
• One-click download of the compressed -draco.glb output

The hero strip at the top shows file sizes in large, high-contrast type — built for screen recordings, demos, and social posts. The savings percentage updates live after compression.

No triangle ratios. No geometric error sliders. Just:

Fine-tune between presets with a single Smaller file ↔ Sharper look slider. A plain-English hint updates as you adjust.

Built on the same pipeline used in real-time 3D projects:

1. Strip existing meshopt / Draco / quantization extensions
2. Weld duplicate vertices
3. Simplify geometry with MeshoptSimplifier
4. Re-bake smooth vertex normals (prevents faceted shading)
5. Compress textures to WebP and downscale to target resolution
6. Draco-encode geometry for minimal transfer size
7. Write binary GLB

Output includes:

• KHR_draco_mesh_compression — geometry
• EXT_texture_webp — textures

Both are supported by Three.js, Unity, Unreal Engine, Godot, and most modern glTF runtimes.

• Node.js 18+
• macOS, Linux, or Windows

git clone https://github.com/boona13/glb-shrink.git
cd glb-shrink
npm install
npm run dev

Open http://localhost:5173 (or the next available port if 5173 is taken).

The Vite dev server serves the UI and proxies API requests to the compression backend on port 3847.

npm run build
npm start

Serves the built UI and API from a single server on port 3847. Override with the PORT environment variable.

1. Drop your GLB into the upload zone (or click to browse)
2. The original model loads in the Before viewer with file size and triangle count
3. Pick a quality preset — Balanced works for most models
4. Click Compress model
5. Compare the After viewer side-by-side
6. Download compressed GLB when you are happy with the result

Use the fine-tune slider to nudge between presets without touching technical parameters.

glb-shrink/
├── docs/
│   └── screenshot.png      # README demo screenshot
├── public/
│   └── draco/              # Draco WASM decoders for Three.js preview
├── server/
│   ├── index.mjs           # Express API (inspect + compress)
│   ├── compress.mjs        # Compression pipeline
│   ├── inspect.mjs         # Model stats inspector
│   └── presets.mjs         # Quality preset → compression params
├── src/
│   ├── main.ts             # Three.js UI
│   └── style.css
├── index.html
├── package.json
└── vite.config.ts

Draco-compressed GLBs work across most real-time 3D pipelines. Example with Three.js:

import { GLTFLoader } from 'three/addons/loaders/GLTFLoader.js';
import { DRACOLoader } from 'three/addons/loaders/DRACOLoader.js';

const dracoLoader = new DRACOLoader();
dracoLoader.setDecoderPath('/draco/');

const loader = new GLTFLoader();
loader.setDRACOLoader(dracoLoader);

const gltf = await loader.loadAsync('/models/my-model-draco.glb');
scene.add(gltf.scene);

Copy the public/draco/ folder into your project's static assets so the decoder can load.

Compressed model looks faceted / flat-shaded
Normals are re-baked automatically. If this appears, try the Sharpest preset — the model may need a higher triangle budget.

Colors look wrong or model is black
The texture may have been stripped during an overly aggressive pass. Try Balanced or Sharpest, or check that the source GLB has embedded textures.

File is still too large
Move the slider toward Smallest file, or pick the Smallest preset. Texture size and triangle count both drop at lower quality settings.

Browser fails to load compressed GLB (Draco error)
Ensure DRACOLoader is configured with setDecoderPath('/draco/') pointing at the Draco decoder files.

MIT — free to use, modify, and ship.

Compression pipeline adapted from the 3D asset workflow built for ThreeShaders — an in-development Three.js game by @boona13.

Built with Three.js, @gltf-transform, and meshoptimizer.