Make objects in a React 3D scene fall, collide, and bounce realistically.
Attach physics bodies to 3D meshes using simple React hooks.
Build interactive 3D experiences where physics runs off the main thread for smooth performance.
| pmndrs/use-cannon | vercel-labs/wterm | nutlope/self.so | |
|---|---|---|---|
| Stars | 2,948 | 2,937 | 2,980 |
| Language | TypeScript | TypeScript | TypeScript |
| Setup difficulty | moderate | moderate | moderate |
| Complexity | 3/5 | 3/5 | 3/5 |
| Audience | developer | developer | vibe coder |
Figures from each repo's GitHub metadata at analysis time.
Requires an existing react-three-fiber 3D scene to attach physics to.
This project adds physics simulation to 3D scenes built with React. React is a popular JavaScript library for building user interfaces, and react-three-fiber is a React-based way to create 3D graphics in the browser using a library called Three.js. use-cannon connects that 3D environment to a physics engine called cannon-es, so objects in your scene can fall, collide, bounce, and behave as they would in the physical world. The physics calculations run in a web worker, which is a background thread separate from the main browser tab. This matters because physics simulation can be computationally expensive, and keeping it off the main thread means the rest of your application stays responsive and does not stutter. The repository is organized as a monorepo containing three packages. The main one, @react-three/cannon, provides React hooks that let you attach physics bodies to 3D objects with just a few lines of code. A second package handles the low-level communication between the physics worker and the main thread. A third package contains example scenes demonstrating the library. Live demos of the examples are available at cannon.pmnd.rs. Detailed documentation and a getting started guide are in the main package's README. The project is part of the Poimandres open-source collective, which maintains several related tools for 3D work in React.
A library that adds realistic physics, like gravity and collisions, to 3D scenes built with React and react-three-fiber.
Mainly TypeScript. The stack also includes TypeScript, React, Three.js.
Setup difficulty is rated moderate, with roughly 30min to a first successful run.
Mainly developer.
This repo across BitVibe Labs
Verify against the repo before relying on details.