three

About

JavaScript 3D library

What detecting three tells you about a site

three (Three.js) is the dominant WebGL library, so its presence tells you the page renders real 3D — product configurators, data visualisation, games or immersive marketing scenes — and is doing GPU work, not just DOM updates. It's one of the heavier dependencies a site can ship, so it usually reflects a deliberate, experience-led decision.

Why the exact three version matters

Three.js has no semver-stable public API and ships breaking changes on a near-monthly cadence by revision number (r150, r160…), so the exact version is unusually important: examples, loaders and the @react-three ecosystem are tightly coupled to specific Three revisions.

three in a real-world stack

When you find three in a bundle, it rarely travels alone. @react-three/fiber and @react-three/drei on React sites; various GLTF loaders and post-processing add-ons.

Quick facts

How Sourcemap Explorer detects three

three ships as v0.185.1, published 2026-07-01 and carries 0 direct dependencies, 312 versions on the registry. Those exact numbers are the footprint Sourcemap Explorer matches when three rides inside a deployed bundle — here is how the detection works.

We catch three from two complementary signals: bundled source paths and the embedded package.json. Modern bundlers (webpack, Vite, esbuild, Rollup, Turbopack) preserve the original node_modules/three/ paths inside the JavaScript sourcemap's sources[] array — that's the canonical signal. When the matching package.json is also captured in sourcesContent[], we read the exact version field — patch number included. No regex guessing, no version inference.

1. 1

   Confirm the site exposes sourcemaps

   In DevTools Network, check the response headers of any application script for `SourceMap` or `X-SourceMap`. Failing that, fetch the script's last 4 KB and look for a `//# sourceMappingURL=` comment — that map is where the `three` paths live.

2. 2

   Find the package in the bundle

   Open DevTools → Network → reload. Click any application script and look at its sourcemap. Inside, search `sources[]` for entries matching `node_modules/three/` — every match confirms the package is bundled. The matching `sourcesContent[i]` for `node_modules/three/package.json` gives you the exact installed version.

3. 3

   Read the version directly from package.json

   Run `jq -r '. as $m | $m.sources | to_entries[] | select(.value | endswith("node_modules/three/package.json")) | $m.sourcesContent[.key] | fromjson | .version' bundle.js.map`. Sourcemap Explorer automates the same query in the popup.

Recent security advisories for three

The 1 most recent advisories affecting some versions of three, aggregated from OSV.dev (GitHub Advisory + CVE data). A listing here doesn't mean the version a given site ships is affected — each advisory applies to a specific version range. Sourcemap Explorer reads the exact bundled version so you can check it against these ranges.

1. HIGHCVE-2020-28496· 2021-03-01

   Denial of service in three

Recent versions

three README

Live mirror of the GitHub README, for reference. Updated whenever the repo's default branch changes.

import * as THREE from 'three';

const width = window.innerWidth, height = window.innerHeight;

// init

const camera = new THREE.PerspectiveCamera( 70, width / height, 0.01, 10 );
camera.position.z = 1;

const scene = new THREE.Scene();

const geometry = new THREE.BoxGeometry( 0.2, 0.2, 0.2 );
const material = new THREE.MeshNormalMaterial();

const mesh = new THREE.Mesh( geometry, material );
scene.add( mesh );

const renderer = new THREE.WebGLRenderer( { antialias: true } );
renderer.setSize( width, height );
renderer.setAnimationLoop( animate );
document.body.appendChild( renderer.domElement );

// animation

function animate( time ) {

	mesh.rotation.x = time / 2000;
	mesh.rotation.y = time / 1000;

	renderer.render( scene, camera );

}

git clone --depth=1 https://github.com/mrdoob/three.js.git

FAQ