Requirements & compatibility
Browser, three.js, decoder, and project requirements for loading downloaded GLBs.
threejsassets files use the glTF 2.0 .glb format. For the main web workflow, use a modern WebGL 2 browser and a recent version of three.js or React Three Fiber.
Browser requirements
- WebGL 2 for current three.js releases.
- Desktop-sized browser window for the full Studio workspace.
- GPU support for a compressed texture format when loading a KTX2 model.
KTX2Loader.detectSupport(renderer)handles the selection for you.
Project requirements
Catalog GLBs use Draco-compressed geometry, so configure DRACOLoader. Add KTX2Loader only for models that contain KTX2/Basis textures.
Use decoder files from the same three.js version installed in your project:
mkdir -p public/draco public/basis
cp -R node_modules/three/examples/jsm/libs/draco/gltf/. public/draco/
cp node_modules/three/examples/jsm/libs/basis/basis_transcoder.* public/basis/If your model does not use KTX2 textures, you can omit the /basis/ files and KTX2Loader.
Next.js
Next.js works with the same files and loaders:
- Put downloaded models in
public/, for examplepublic/barrel-01.glb. - Put decoders under
public/draco/and, when needed,public/basis/. - Load them from
/barrel-01.glb,/draco/, and/basis/. - Render WebGL code in a Client Component using
"use client".
Other engines
Many engines and DCC tools can import glTF 2.0, but extension support varies by version and plugin. Check that your target supports Draco and any texture extensions present in the file. The primary supported workflow and examples are for three.js and React Three Fiber.