Placeholder data và initial data trong React Query khác gì nhau?

initialData được treat như real cached data và ảnh hưởng staleTime; placeholderData là temporary fill UI (isPlaceholderData=true), không persist vào cache — dùng placeholderData: prev => prev để giữ data trang trước khi paginate.

• Hai option này phục vụ mục đích khác nhau. placeholderData: data tạm thời để fill UI trong khi fetch, KHÔNG được lưu vào cache, không có timestamp, isPlaceholderData: true để component biết đang hiển thị placeholder.
• Dùng khi: muốn show skeleton data có structure (ví dụ array 5 empty items), hoặc placeholderData: (prev) => prev để giữ data page trước khi chuyển page (keepPreviousData pattern). initialData: được treat như real cached data — có dataUpdatedAt, ảnh hưởng staleTime (nếu initialData đủ fresh thì không refetch ngay).
• Dùng khi: data đã có từ nguồn khác (ví dụ đã fetch list, giờ dùng item từ list làm initialData cho detail query: initialData: () => queryClient.getQueryData(['todos'])?.find(t => t.id === id), initialDataUpdatedAt: () => queryClient.getQueryDataState(['todos'])?.dataUpdatedAt).

Pitfall: dùng sai initialData với hardcoded value sẽ ngăn query refetch vì React Query nghĩ data còn fresh — luôn kết hợp với initialDataUpdatedAt: 0 nếu muốn force refetch.