Skip to main content
Lab Grimoire
TW EN
☕ Coffee
Spellbook / draco.js: Pure JavaScript Draco Mesh Decoder for three.js
software

draco.js: Pure JavaScript Draco Mesh Decoder for three.js

A 24KB pure-JS drop-in replacement for three.js DRACOLoader that eliminates WASM setup entirely. Best for static-site deployments where WASM CORS and CSP cause friction. Trades ~1.5x decode speed for zero-config simplicity. Limited to triangle-mesh only.

Best For

Front-end developers shipping three.js scenes with Draco-compressed GLB models on static hosting platforms (Cloudflare Pages, Vercel, Netlify) who want to skip the WASM setup headache.

How I Actually Use It

I evaluated draco.js for potential 3D molecular and cell-structure visualization on static-deployed biomedical education sites. The real appeal: swap one import, delete the WASM files and Worker config, and Draco decoding just works. No setDecoderPath, no CORS headers to debug, no CSP exceptions for wasm-unsafe-eval. The API is backward-compatible with three.js DRACOLoader, so existing code needs almost no changes.

Where It Is Strong

  • Tiny bundle: 24KB gzipped vs 104KB for the official WASM decoder, a 4.3x reduction.
  • Zero-config deployment: Single ES module import. No .wasm files to host, no Worker to configure, no CORS to fix.
  • Drop-in compatible: Accepts the same DRACOLoader API. setDecoderPath and setDecoderConfig calls are silently accepted for backward compatibility.
  • Verified output: Element-by-element comparison confirms identical decoded geometry to the official WASM version.
  • Trusted author: Written by mrdoob, the creator and lead maintainer of three.js.

Where It Fails

  • Slower decoding: Approximately 1.4 to 1.6x slower than WASM. On meshes above 100k vertices, the delay becomes perceptible.
  • Triangle-mesh only: Supports only the EdgeBreaker path used by glTF. No point-cloud, no KD-tree traversal, no metadata decoding.
  • Early-stage project: A single commit with zero tagged releases. Mature in code quality but not in release discipline.
  • Not for heavy 3D applications: If your scene has millions of triangles or you need real-time streaming decode, stick with WASM.

Pricing, Difficulty, and Risk

Pricing: Fully open-source under MIT. The decode logic derives from Google Draco (Apache-2.0); no license conflict.

Difficulty: Intermediate. You need working knowledge of three.js and its loader pipeline. The swap itself is trivial, but understanding when the speed tradeoff matters requires profiling your actual models.

Risk: Low. Pure client-side decoding, no data leaves the browser. Supply-chain risk is minimal given the author's identity. The main concern is long-term maintenance: with only one commit, bug fixes depend on mrdoob's continued interest.

Verdict

If you deploy three.js with Draco models on a static host and WASM setup has burned your time before, draco.js is a clean fix. Skip it if decode speed is critical or you need point-cloud support.

Source