# Babylon.js — Powerful 3D Game and Rendering Engine

> Babylon.js is a powerful, beautiful, simple, open 3D game and rendering engine for the web. WebGL + WebGPU, Playground IDE, Node Material Editor, GUI system, physics, and VR/AR support. Microsoft-backed with enterprise polish.

## Install

Save as a script file and run:

## Quick Use

```bash
npm i @babylonjs/core
```

```ts
import {
  Engine, Scene, ArcRotateCamera, HemisphericLight, MeshBuilder, Vector3,
} from "@babylonjs/core";

const canvas = document.getElementById("renderCanvas") as HTMLCanvasElement;
const engine = new Engine(canvas, true);
const scene = new Scene(engine);

const camera = new ArcRotateCamera("cam", -Math.PI / 2, Math.PI / 3, 10, Vector3.Zero(), scene);
camera.attachControl(canvas, true);

new HemisphericLight("light", new Vector3(0, 1, 0), scene);
MeshBuilder.CreateGround("ground", { width: 10, height: 10 }, scene);
const box = MeshBuilder.CreateBox("box", { size: 2 }, scene);
box.position.y = 1;

engine.runRenderLoop(() => scene.render());
window.addEventListener("resize", () => engine.resize());
```

## Intro

Babylon.js is a powerful, beautiful, simple, and open 3D game and rendering engine for the web. Originally created at Microsoft by David Catuhe, it brings AAA-game-engine features (PBR, physics, advanced post-processing, VR/AR) into a single JavaScript/TypeScript framework. Used by Adobe, Airbus, Siemens, and many enterprises.

- **Repo**: https://github.com/BabylonJS/Babylon.js
- **Stars**: 25K+
- **Language**: TypeScript
- **License**: Apache 2.0

## What Babylon.js Does

- **PBR materials** — physically based rendering with IBL
- **Node Material Editor** — visual shader authoring
- **Playground** — online IDE for experiments and sharing
- **GUI system** — 2D and 3D in-scene UI
- **Physics** — Havok, Cannon, Oimo integrations
- **Animation** — keyframe, skeletal, morph targets, FBX import
- **Post-processing** — bloom, DOF, SSAO, motion blur
- **WebXR** — VR/AR with controller support
- **WebGPU** — experimental next-gen backend
- **glTF 2.0** — first-class import with KHR extensions

## Architecture

Engine manages the GL/GPU context. Scene holds Cameras, Lights, Meshes, Materials, Nodes. Mesh builders provide primitives; loaders handle glTF/OBJ/STL/BabylonNative formats. Everything is strongly typed with TypeScript.

## Self-Hosting

Client library.

## Key Features

- PBR materials
- Node Material Editor (visual shaders)
- WebGL + WebGPU backends
- Physics plugins (Havok, Cannon, Oimo)
- WebXR (VR/AR)
- glTF 2.0 loader
- Built-in Inspector for debugging
- Playground IDE
- GUI system (2D + in-scene 3D)
- TypeScript-first

## Comparison

| Engine | Focus | Ecosystem | Languages |
|---|---|---|---|
| Babylon.js | Games + enterprise 3D | Large | TS/JS |
| Three.js | Flexible 3D lib | Largest | JS |
| PlayCanvas | Collab editor | Medium | JS |
| Unity WebGL | Full game engine | Huge | C# |
| Godot HTML5 | Full game engine | Medium | GDScript |

## 常见问题 FAQ

**Q: Babylon.js vs Three.js？**
A: Babylon 是完整游戏引擎（场景、物理、动画、编辑器），开箱即用；Three.js 是更小的 3D 库，更灵活但需要自己拼工具链。企业项目多选 Babylon，艺术/实验多选 Three。

**Q: 支持 WebGPU 吗？**
A: 支持。启用 `WebGPUEngine`（仍在完善中）。v7+ 渐进式可用。

**Q: 用 Node Material Editor？**
A: 可视化节点编辑器，在线设计 shader 后导出为 Babylon 材质。不需要写 GLSL 也能做复杂效果。

## 来源与致谢 Sources

- Docs: https://doc.babylonjs.com
- GitHub: https://github.com/BabylonJS/Babylon.js
- License: Apache 2.0

---
Source: https://tokrepo.com/en/workflows/3ae90ed5-35aa-11f1-9bc6-00163e2b0d79
Author: Script Depot