3D Model Compression Guide: Comparing Draco and Meshopt Codecs

Why Is 3D Model Compression Important?

One of the biggest challenges of serving 3D content on the web is file size. A detailed furniture model can exceed 50 MB if left unoptimized. Loading these models across dozens of product pages on an e-commerce site increases both bandwidth costs and negatively affects user experience. This is where 3D model compression comes into play.

The GLTF/GLB format has become the de facto standard for 3D content distribution on the web. Two important compression codecs can be used within this format: Draco, developed by Google, and Meshopt, developed by Arseny Kapoulkine. Both significantly reduce model file sizes, but they do so through different methods and with different trade-offs.

Before Compression: Fundamental Optimizations

There are fundamental optimizations that should be performed before applying any codec. Skipping these limits the effectiveness of even the best codec:

• Clean up unnecessary vertices: Remove unused vertices, edges, and faces
• Reduce polygon count: Use decimation tools to lower polygon count while preserving visual quality
• Optimize texture sizes: 4K textures are unnecessary for most web uses; 1K or 2K is sufficient
• Change texture format: Apply GPU compression by using KTX2 (Basis Universal) format instead of PNG
• Merge multiple materials: Use texture atlases to reduce draw call count

Draco Codec: A Deep Dive

How Does It Work?

Draco is an open-source geometry compression library developed by Google. It compresses mesh data (vertex positions, normals, UV coordinates, color data) using quantization and entropy coding techniques.

Draco's compression process involves the following steps:

1. Quantization: Floating-point values are rounded to a specific bit depth. For example, 32-bit float positions are converted to 11-bit integers.
2. Prediction coding: Vertex positions are predicted from neighboring vertices, and difference values are stored. This reduces data redundancy.
3. Entropy coding: The resulting data is compressed using Huffman or arithmetic coding.

Draco Settings and Parameters

The key parameter controlling Draco's compression aggressiveness is the quantization bit values:

• Position quantization (default 11 bits): Precision of vertex positions. Lower values produce smaller files but increase the risk of geometry distortion.
• Normal quantization (default 8 bits): Precision of normal vectors. Affects lighting quality.
• UV quantization (default 10 bits): Texture coordinate precision. Low values may cause texture shifting.
• Compression level (0-10): Compression level. Higher values produce smaller files but increase encoding time.

Advantages of Draco

• Very high compression ratios — 80-95 percent file size reduction is possible
• Broad ecosystem and tool support backed by Google
• Built-in support in Three.js, Babylon.js, and other major libraries

Disadvantages of Draco

• Decompression is computationally intensive and requires extra time
• The WASM decoder file requires approximately 300 KB of additional download
• Compressed data cannot be sent directly to the GPU without an additional pass
• Noticeable visual artifacts can occur at high quantization settings
• Compatibility issues may arise with morph targets and skinning data in animated models

Meshopt Codec: A Deep Dive

How Does It Work?

Meshopt (meshoptimizer) is a library that provides GPU-friendly data layout optimization and compression. Unlike Draco, Meshopt focuses on how data is sent to the GPU, and decompression of compressed data is significantly faster.

Meshopt's approach consists of the following stages:

1. Vertex and index buffer optimization: Data is reordered to match GPU cache access patterns
2. Quantization: Similar to Draco, values are rounded to lower precision
3. Filter coding: Special filters are applied for vertex attributes (octahedral encoding for normals, exponential encoding for positions)
4. Byte-level compression: The resulting data is compressed at the byte level

Advantages of Meshopt

• Very fast decompression — noticeably faster than Draco
• Decompressed data can be written directly to GPU buffers without additional conversion
• Decoder size is very small — approximately 20 KB
• Excellent compatibility with animations and morph targets
• Performs very well when combined with general compression like Gzip or Brotli
• Progressive loading support — models can be loaded incrementally

Disadvantages of Meshopt

• Standalone compression ratio is not as high as Draco
• For best results, it needs to be used in combination with server-side Brotli or Gzip compression
• Does not have as widespread tool support as Draco

Practical Comparison: Real-World Scenarios

Static Product Models

For static furniture or accessory models displayed on an e-commerce site, both codecs perform well. Draco generally produces smaller file sizes, but the Meshopt+Brotli combination achieves very similar sizes and decompresses much faster. If you care about the user's initial loading experience, Meshopt stands out in this scenario.

Animated Models

For models with skeletal animations or morph targets, Meshopt is significantly more compatible. Draco's compatibility issues with animation data make Meshopt the natural choice in this scenario.

Large Scenes with Multiple Models

In an architectural visualization scene, dozens of models load simultaneously. In this scenario, Meshopt's fast decompression provides a major advantage. With Draco, decompressing each model can noticeably extend total loading time.

Implementation Guide: Compression with glTF-Transform

To easily apply both codecs, you can use the glTF-Transform CLI tool. This tool offers a comprehensive command set for transforming and optimizing GLTF/GLB files.

Compression with Draco

To apply Draco compression, use the draco command in the gltf-transform CLI. Values like 14 bits for position quantization, 10 bits for normal quantization, and 12 bits for texture coordinate quantization are good starting points. For models requiring high precision, you can increase the bit values.

Compression with Meshopt

For Meshopt compression, use the meshopt command in the gltf-transform CLI. After applying Meshopt, serving the file with Brotli compression is recommended. Most modern CDNs and web servers support Brotli compression.

Add Texture Optimization Too

Compression should not be limited to geometry alone. Textures typically constitute 60-80 percent of the total file size. Converting to KTX2 format dramatically reduces texture size and keeps textures compressed on the GPU, which also lowers VRAM usage.

Which Codec Should You Choose?

When making your decision, ask these questions:

• Do your models have animations? If so, prefer Meshopt.
• Does your server support Brotli compression? If so, Meshopt+Brotli delivers excellent results.
• Do you need the absolute smallest file size? Draco offers more aggressive compression.
• Are many models loading simultaneously in the scene? Meshopt's fast decompression is advantageous.
• Is progressive loading important? Meshopt supports it, Draco does not.

If a general recommendation is needed, Meshopt is increasingly preferred in modern web projects. Fast decompression, small decoder size, animation compatibility, and progressive loading support make it a strong choice for most scenarios.