role-frontend:state-management

React state management decisions depend on colocating state locally for isolated components or lifting it globally using Zustand or Redux Toolkit when shared access is needed across the application.

Server cache state in React is best managed using TanStack Query or SWR to handle data fetching and background updates, separating server state from client global state managed by Zustand or Jotai.

Optimistic updates with TanStack Query and Zustand involve immediately updating local UI state before server mutations complete, then rolling back or confirming based on the server response to ensure smooth user experiences.

Use XState state machines instead of Redux Toolkit when managing complex component logic requiring strict transitions and predictable behavior, whereas Redux Toolkit is suited for standard global application state.

Optimize React state management performance using granular selectors and efficient subscriptions in Zustand or Jotai, ensuring components only re-render when their specific state slices actually change.

Yes, Jotai is suitable for managing complex interconnected form fields in React because its atomic state model allows fine-grained updates to individual fields, preventing unnecessary re-renders and ensuring smooth validation.