Three.js
A widely used JavaScript library for 3D graphics on the web
js is a JavaScript library that provides a high-level scene graph API — cameras, lights, materials, geometries, and renderers — over WebGL (and increasingly WebGPU), making it dramatically easier to build 3D graphics for the browser than…
Definition
Three.js is a JavaScript library that provides a high-level scene graph API — cameras, lights, materials, geometries, and renderers — over WebGL (and increasingly WebGPU), making it dramatically easier to build 3D graphics for the browser than writing raw WebGL.
Overview
Three.js was created by Ricardo Cabello (known as Mr.doob) in 2010 and has since become the most widely used 3D graphics library for the web. Its core contribution is abstracting away WebGL's verbose, low-level API — manual buffer management, shader compilation, and render state tracking — behind a familiar scene-graph model: a `Scene` containing `Mesh` objects composed of `Geometry` and `Material`, illuminated by `Light` objects, and viewed through a `Camera`, all rendered by a `WebGLRenderer` (or, more recently, an experimental `WebGPURenderer`). The library ships an extensive set of built-in geometries (boxes, spheres, planes, extrusions), materials (basic, standard PBR, physical, toon), loaders for common 3D file formats (glTF, OBJ, FBX), and post-processing effects (bloom, depth of field, outline). It also includes controls for common camera interaction patterns (orbit, first-person, trackball) and integrates with physics engines and animation systems for more complete interactive scenes. Three.js underpins a large share of production 3D web experiences: product configurators, architectural walkthroughs, data visualizations, WebXR (VR/AR) experiences, and browser-based games. Its React ecosystem counterpart, React Three Fiber, lets developers describe Three.js scenes declaratively as React component trees, which has significantly increased its adoption among web application developers who are not graphics specialists. Compared to Babylon.js, Three.js is generally seen as more minimal and closer to a rendering toolkit, giving developers more flexibility but requiring more manual assembly for game-engine-style features (physics, full scene editors), which Babylon.js bundles more comprehensively out of the box.
Key Features
- High-level scene graph API abstracting WebGL's low-level rendering pipeline
- Extensive built-in geometries, materials (including PBR), and lighting models
- Loaders for common 3D formats (glTF, OBJ, FBX, DRACO-compressed meshes)
- Built-in post-processing effects pipeline (bloom, depth of field, SSAO)
- Camera control helpers (orbit, first-person, trackball controls)
- Growing WebGPURenderer support alongside its mature WebGLRenderer
- Large ecosystem including React Three Fiber for declarative React integration
- Extensive community examples and one of the largest 3D web communities