model-viewer

Why it's ranked here

The case is strong because the project covers more than basic rendering. It includes accessible defaults, customizable slots, browser capability checks, an effects package, an editor, documentation, and dedicated render-fidelity tooling. Its browser test matrix also spans mobile and desktop WebKit and Chromium contexts.

What's good

The component exposes practical interface layers instead of a bare canvas. Default controls cover loading, interaction prompts, AR entry, AR exit, and panning, while slots let applications replace those pieces. Build outputs support module and legacy bundle formats, minification, source maps, optional external Three.js, and bundled TypeScript declarations.

Tradeoffs

The repository is a sizable multi-package workspace with documentation, effects, editor, shared assets, and fidelity infrastructure. Development requires Node.js and npm. Windows contributors are directed toward WSL2, Chrome configuration is needed for tests there, and fidelity testing can require GUI support unavailable in the documented Windows 10 setup.

How to use it well

Use it for product pages, catalogs, documentation, or other browser experiences that need interactive models and optional AR with customizable controls. Adopt the effects package when post-processing matters. Use the companion editor when preparing or modifying GLTF and GLB assets. The viewer itself does not replace that asset-authoring workflow.

Observed

License

Apache-2.0

Primary language

TypeScript

Packaging

Private npm workspace containing five packages

Interface

Browser web component library with ESM and UMD bundles

Browser testing

Playwright configurations cover mobile and desktop WebKit and Chromium contexts

Repository structure

Includes viewer, effects, documentation, render-fidelity tools, and model editor projects