mobx
MobX is a battle-tested state management library that makes state management simple and scalable through transparent functional reactive programming. MobX autom…
Installation
npm install mobx mobx-react-lite
yarn add mobx mobx-react-lite
pnpm add mobx mobx-react-lite
Import
import { makeAutoObservable } from 'mobx';Quick Example
import { makeAutoObservable } from 'mobx';
import { observer } from 'mobx-react-lite';
class Counter {
count = 0;
constructor() { makeAutoObservable(this); }
increment() { this.count++; }
}
const counter = new Counter();
const CounterView = observer(() => (
<button onClick={() => counter.increment()}>{counter.count}</button>
));About mobx
MobX is a battle-tested state management library that makes state management simple and scalable through transparent functional reactive programming. MobX automatically tracks which state properties are used by each component and re-renders only the components that depend on changed properties, providing optimal rendering performance without manual optimization. State in MobX is defined using observable properties, computed values derive from state automatically and are cached until their dependencies change, actions modify state with automatic batching, and reactions (autorun, when, reaction) perform side effects when observed state changes. MobX supports classes with decorators (@observable, @computed, @action) and a functional API (makeObservable, makeAutoObservable) that automatically makes all properties observable and all methods actions. The library integrates with React through mobx-react-lite, providing an observer HOC that makes components reactive to observable state changes. MobX's philosophy differs fundamentally from Redux — instead of explicit action dispatching and reducer functions, MobX uses mutable state with automatic dependency tracking. This approach reduces boilerplate significantly and provides a more natural programming model for developers accustomed to object-oriented patterns. MobX is particularly popular in enterprise applications and teams with Java/C# backgrounds.
Quick Facts
| Package | mobx |
| Category | State Management |
| Weekly Downloads | 2M+ |
| License | MIT |
| Install | npm install mobx mobx-react-lite |
Related Packages
Redux is a predictable state container for JavaScript applications, most commonly used with React bu…
Zustand is a small, fast, and scalable state management library for React that provides a simple hoo…
React is the most popular JavaScript library for building user interfaces, developed and maintained …
Valtio is a proxy-based state management library for React that makes state management as simple as …
Browse npm Packages by Category
Explore our reference of 200 popular npm packages with install commands, examples, and quick-start guides.