What it is
MobX makes state management reactive and transparent. You mark data as observable, and anything that reads it becomes a tracked dependency that re runs when the data changes.
The three roles
- Observables: the state, such as objects, arrays, and class fields.
- Computeds: values derived from observables, cached until a dependency changes.
- Reactions: side effects like rendering that run when observed data updates.
Automatic tracking
You never declare dependencies by hand. When a computed or reaction runs, MobX records exactly which observables it touched. On the next change only the affected derivations re run. This minimizes wasted work without manual wiring.
- Change state through actions to batch updates.
- Computeds stay lazy and memoized.
- Components observe and re render on relevant changes only.
Key idea
MobX tracks reads automatically, so changing an observable re runs exactly the computeds and reactions that depend on it.