Trong các dự án monorepo React phục vụ cả Web (Next.js) và Mobile (React Native), việc chọn giải pháp quản lý trạng thái phù hợp quyết định đến khả năng bảo trì và hiệu năng. Zustand là thư viện state container cực nhẹ (khoảng 1 KB gzip) và không bắt buộc dùng Context, trong khi React Query (TanStack Query) chuyên xử lý server state, caching, refetch và pagination. Kết hợp hai công cụ này giúp tách biệt rõ ràng client state (UI, cài đặt người dùng) và server state (dữ liệu API). Lợi ích chính: - Bundle size nhỏ, không gây phồng ứng dụng mobile. - API đơn giản, hook-based, dễ học cho thành viên mới. - Hỗ trợ TypeScript tự động suy luận kiểu dữ liệu. - React Query cung cấp devtools, stale‑while‑revalidate, retry tự động. Kiến trúc đề xuất: 1. Tạo thư mục packages/state chứa store Zustand chung (authStore, uiStore). 2. Trong packages/api định nghĩa các hook useQuery/useMutation dùng React Query, tái sử dụng cho cả Next.js và React Native. 3. Cấu hình QueryClientProvider ở gốc ứng dụng (pages/_app.tsx cho Next.js, App.tsx cho React Native) với cacheTime, staleTime phù hợp. 4. Sử dụng middleware persist của Zustand (async storage trên mobile, localStorage trên web) để giữ session khi reload. Ví dụ thực tế (code minh hoạ): - authStore.ts: export const useAuthStore = create((set) => ({ user: null, login: (u) => set({ user: u }), logout: () => set({ user: null }) })); - useUserQuery.ts: export const useUser = (id) => useQuery({ queryKey: ['user', id], queryFn: () => api.getUser(id), enabled: !!id }); - Component Header: const { user } = useAuthStore(); const { data } = useUser(user?.id); Mẹo áp dụng ngay: - Tách file store theo domain (auth, ui, settings) để tránh re‑render không cần thiết. - Bật select trong useQuery để chỉ subscribe trường cần thiết. - Sử dụng queryClient.invalidateQueries(['user']) sau mutation để cập nhật cache tự động. - Cấu hình retry: 2 lần cho GET, 0 lần cho mutation nhạy cảm. Kết luận: Zustand + React Query mang lại giải pháp state management gọn nhẹ, tách biệt rõ ràng client/server state, phù hợp cho monorepo đa nền tảng và dễ mở rộng khi dự án lớn dần.