persistQueryClient trong React Query dùng để làm gì?

persistQueryClient cho phép serialize toàn bộ React Query cache vào storage, restore khi user reload → data hiển thị ngay lập tức không cần fetch lại.

• Setup: import { persistQueryClient } from '@tanstack/react-query-persist-client'; import { createSyncStoragePersister } from '@tanstack/query-sync-storage-persister'. const persister = createSyncStoragePersister({ storage: window.localStorage }); persistQueryClient({ queryClient, persister, maxAge: 1000 60 60 * 24 }) — maxAge là thời gian data được phép restore (default 24h).
• Với React Native dùng createAsyncStoragePersister cho AsyncStorage.
• IndexedDB persister cho data lớn hơn localStorage limit (5MB).
• Khi app load: nếu persisted data còn trong maxAge, hydrate vào cache ngay → queries show cached data, background refetch nếu stale. buster option để invalidate toàn bộ persisted cache khi deploy version mới (thay đổi cấu trúc data).

Pitfall: không persist sensitive data (tokens, personal info) vì localStorage không mã hóa.

• Dùng dehydrateOptions.shouldDehydrateQuery để filter queries nào được persist.