TanStackAdvanced
Cache Invalidation
invalidateQueries-এর কৌশল, filtered invalidation ও কোথায় কীভাবে ইনভালিড করা উচিত — বাংলায়।
9টি অংশবাংলা ভাষায়
মিউটেশনের সফলতার পর biggest সিদ্ধান্ত — কোন cache ইনভালিড করব। খুব বেশি ইনভালিড = অনেক request; খুব কম = পুরনো ডেটা। সঠিক কৌশল শিখি।
invalidateQueries
ভিত্তিts
ts
queryClient.invalidateQueries({ queryKey: productKeys.all });
// → key 'products' prefix-এর সব query 'stale' হয় + active গুলো refetch হয়অতি সুনির্দিষ্টts
ts
// শুধু list queries (table/filter)
queryClient.invalidateQueries({ queryKey: productKeys.lists() });
// শুধু একটি detail
queryClient.invalidateQueries({ queryKey: productKeys.detail("p1") });
// শুধু অ্যাকটিভ queries refetch, বাকিদের শুধু stale
queryClient.invalidateQueries({
queryKey: productKeys.lists(),
refetchType: "active",
});কোন mutation → কোন invalidation
| Mutation | Invalidate | কেন |
|---|---|---|
| Create | productKeys.all | নতুন item list/detail-তে আসতে পারে |
| Update | productKeys.lists() + detail | list-গুলো বদলেছে; edit-করা item-ও |
| Delete | productKeys.all | যেকোনো list থেকে item সরে যাবে |
Filtered invalidation (predicate)
শর্তমতো invalidatets
ts
// category filter-এর list-গুলোর শুধু 'active' বিশেষ inform
queryClient.invalidateQueries({
queryKey: productKeys.lists(),
predicate: (query) => {
const params = query.queryKey[2] as ProductQueryParams;
return params.status === "active";
},
});invalidate ≠ refetch immediate
invalidateQueries-এ query 'stale' + currently-mounted গুলো refetch হয়। ব্যাকগ্রাউন্ড (unmounted) query পরে যাবতীয় refetch হয়। তাই প্রায়ই যে invalidate-ই আপনাকে ভাবে-ঠিক ঠিকই — অতর্কিত request-এর ভয় নেই।
শেষ প্যারায় নিজে practice করুন — কোড কপি করে নিজের এডিটরে চালিয়ে দেখুন।