Mobx React Lite
mobx-react-lite
Lightweight React bindings for MobX based on function components and Hooks
State Management
mobx
mobservable
react-component
react
reactjs
reactive
hooks
observer
useLocalObservable
mobx-react-lite
Stars
28k
Weekly
3.2M
Open issues
58
Bundle
~25 kB
Installation
npm install mobx-react-liteCode example
import { create } from "mobx-react-lite";
const useStore = create((set) => ({
count: 0,
inc: () => set((s) => ({ count: s.count + 1 })),
}));
export function Example() {
const { count, inc } = useStore();
return (
<button type="button" onClick={inc}>
Count: {count}
</button>
);
}Pros & cons
Pros
- Actively maintained by Daniel K.
- 3.2M weekly downloads. Battle tested
- First-class TypeScript definitions
- MIT licensed
Considerations
- Adds roughly ~25 kB to your bundle
- Needs client-only rendering in SSR frameworks
- Not supported in React Native
- 58 open issues on GitHub