Comparing
React data fetching with stale-while-revalidate caching — one hook for all your remote data needs with automatic revalidation.
🐻 Bear necessities for state management in React
| Metric | swr | zustand |
|---|---|---|
| Ecosystem | npm | npm |
| Difficulty | Beginner ✓ | Intermediate |
| Weekly downloads | 3.5M | 30.7M↑ |
| Latest version | v2.3.3 | v5.0.12 |
| Recipes | 2 | 7↑ |
swr only
Shared
zustand only
Read-heavy React apps: dashboards, profiles, lists. When you want simple cache-first data with background refresh. When components far apart need to share server data without prop drilling.
Use Zustand for global UI state that multiple components need to read and write: auth status, theme preferences, shopping cart, modal state, or any data too complex for prop drilling but not complex enough to justify Redux.
Complex mutation workflows with optimistic updates and rollbacks (react-query/TanStack Query is more powerful for this). Server-side rendering where you need full control over data fetching timing.
Zustand is not designed for server state — use React Query for that. For very large applications with complex state machines or time-travel debugging requirements, Redux Toolkit's tooling is more mature.
swr
zustand
+3 more