Three.js 30,815 (Three.js) is a rendering library; Babylon.js 89,603 is a complete 3D engine. One project, released in lockstep, ships the renderer with Havok 516,349 physics, particles, a 2D and 3D GUI, audio, WebXR, an Inspector and visual editors. It draws with WebGL 2 through Engine or with WebGPU through WebGPUEngine, and your scene code is the same either way.
WebGL and WebGPU own the matrices, lighting math, shaders and WebGPU pipeline; this chapter points to them, and compares the APIs where Three.js solved the same problem. BookNest's virtual bookstore, a room with shelves holding the six books, grows section by section in one script, bookstore.js, and is assembled in The Virtual Bookstore. Every figure is a real render of Babylon.js 9.28.0 in headless Chrome 154 1 on the book's NVIDIA GeForce GTX 1650; WebXR (WebXR) needs a headset and is code only.
What you will learn:
How engines, scenes, cameras, meshes, materials, lights and glTF assets fit together
How to add animation, picking, a GUI, Havok physics, particles, post-processing and audio
How to debug and speed up a scene, and choose between Babylon.js, Three.js and PlayCanvas 62,178
Sections
- Babylon.js Releases
- Engine and Scene
- Cameras
- Meshes and MeshBuilder
- The Standard and PBR Materials
- The Node Material Editor
- Lights and Shadows
- Textures and IBL
- glTF and Containers
- Animation
- Actions and Picking
- 2D GUI
- The 3D GUI
- Physics with Havok
- Particles
- Post-Processing
- Inspector and Tools
- Many Objects
- Audio with the Audio Engine v2
- WebXR
- The Virtual Bookstore
- How a Frame Renders
- Alternatives
- Test Yourself!