React Query Quiz ( Intermediate ) - All Questions

This medium-level React Query quiz is designed for developers who already know the basics and want to master caching strategies, background updates, query invalidation, and real-world data-fetching patterns. Ideal for interviews and production React applications using TanStack Query.

Question 1: Why is React Query considered different from Redux for data handling?

It manages server state instead of client state
It replaces reducers
It stores data permanently
It avoids async code

Explanation: React Query focuses on server-state, not client UI state.

Question 2: What happens when a query key changes?

Cache is ignored
A new query is created and fetched
Old cache is deleted
Query stops permanently

Explanation: A changed query key triggers a new cache entry and fetch.

Question 3: Why should query keys be stable?

To reduce memory usage
To prevent duplicate caches
To improve styling
To enable mutations

Explanation: Stable keys prevent unnecessary refetches and cache duplication.

Question 4: What is the main difference between isLoading and isFetching?

They are identical
isFetching runs only once
isFetching can be true during background refetch
isLoading only applies to mutations

Explanation: isFetching can be true even when cached data exists.

Question 5: Which option prevents a query from running until conditions are met?

retry
staleTime
enabled
cacheTime

Explanation: enabled allows conditional execution of queries.

Question 6: Why is invalidateQueries preferred over manual refetching?

It deletes cache
It marks data stale and refetches safely
It blocks rendering
It disables retries

Explanation: Invalidation ensures consistent cache updates.

Question 7: What problem does staleTime primarily solve?

Retry errors
Over-fetching data
Mutation conflicts
Cache eviction

Explanation: staleTime reduces unnecessary refetching.

Question 8: Which feature allows UI updates before server confirmation?

Background refetch
Polling
Optimistic updates
Prefetching

Explanation: Optimistic updates improve perceived performance.

Question 9: Why should mutations invalidate related queries?

To clear cache
To sync UI with server state
To improve retries
To reduce memory

Explanation: Invalidation keeps cached data consistent.

Question 10: What does keepPreviousData help with?

Caching forever
Avoiding UI flicker during pagination
Retry logic
Mutation rollback

Explanation: It keeps old data while fetching new pages.

Question 11: Which React Query feature supports pagination efficiently?

useMutation
useInfiniteQuery
useQueryClient
useDeferredValue

Explanation: useInfiniteQuery handles paginated data.

Question 12: What happens if multiple components use the same query key?

Multiple network calls
Shared cached result
Cache conflict
Only first component updates

Explanation: Queries with same key share cached data.

Question 13: Why should queries avoid returning new object references unnecessarily?

It breaks hooks
It causes re-renders
It disables cache
It increases bundle size

Explanation: New references can trigger unnecessary renders.

Question 14: What does prefetchQuery help achieve?

Manual cache deletion
Data fetching ahead of navigation
Mutation retries
Error handling

Explanation: Prefetching improves perceived navigation speed.

Question 15: Which option controls how long unused cache stays in memory?

staleTime
retry
cacheTime
enabled

Explanation: cacheTime defines cache garbage collection timing.

Question 16: Why should large query responses be normalized?

For styling
For easier updates and caching
For faster retries
For pagination

Explanation: Normalized data improves maintainability.

Question 17: Which callback runs before a mutation executes?

onSuccess
onError
onMutate
onSettled

Explanation: onMutate is used for optimistic updates.

Question 18: What does onSettled callback guarantee?

Success only
Error only
Runs on success or error
Runs before fetch

Explanation: onSettled always runs after mutation completes.

Question 19: Which setting disables retries entirely?

retry: false
retry: none
retry: off
retry: stop

Explanation: retry: false disables retries.

Question 20: Why is background refetching useful?

Reduces memory
Keeps UI data fresh
Improves styling
Avoids hooks

Explanation: Background refetch updates data silently.

Question 21: Which option is best for dependent queries?

Multiple clients
enabled flag
useMutation
invalidateQueries

Explanation: enabled allows sequencing dependent queries.

Question 22: What does refetchInterval do?

Retries failed queries
Polls data at intervals
Clears cache
Pauses queries

Explanation: refetchInterval enables polling.

Question 23: Why should React Query not manage form input state?

Performance issues
It manages server data only
It breaks hooks
It increases memory

Explanation: Form state is client-side UI state.

Question 24: Which query state indicates cached data with background fetch?

isLoading
isFetching
isIdle
isPaused

Explanation: isFetching signals background refetch.

Question 25: What happens when removeQueries is called?

Marks queries stale
Deletes cache entries
Refetches data
Stops polling

Explanation: removeQueries clears cached queries.

Question 26: Why are query keys often arrays?

Performance
Dynamic parameter support
Error handling
Mutation binding

Explanation: Arrays allow parameterized queries.

Question 27: Which feature improves UX during slow networks?

Blocking UI
Optimistic updates
Manual refetch
Disabled cache

Explanation: Optimistic updates make UI feel faster.

Question 28: What does select option in useQuery do?

Filters network requests
Transforms query data
Changes cache key
Controls retries

Explanation: select derives transformed data.

Question 29: Why should select be used carefully?

It disables caching
It can cause recalculation
It breaks mutations
It blocks refetch

Explanation: Expensive transforms can impact performance.

Question 30: Which behavior occurs by default on window focus?

Cache cleared
Query refetch
Mutation rollback
Polling stops

Explanation: React Query refetches on focus by default.

Question 31: What is the main role of QueryClient?

Fetching data
Managing cache lifecycle
Rendering UI
Handling routing

Explanation: QueryClient controls caching and query behavior.

Question 32: Why should retry logic be limited?

To reduce code
To avoid repeated failed requests
To disable caching
To improve UI

Explanation: Unlimited retries waste network resources.

Question 33: Which feature helps handle server errors gracefully?

Error boundaries
Retry & error states
Suspense only
Local state

Explanation: React Query exposes error handling states.

Question 34: What does suspense mode change?

Caching strategy
Loading state handling
Mutation behavior
Query keys

Explanation: Suspense shifts loading handling to boundaries.

Question 35: Why is React Query suitable for micro-frontends?

Global store
Independent caching per app
Shared reducers
Centralized routing

Explanation: Each app can manage its own server state.

Question 36: Which option prevents refetch on remount?

enabled: false
refetchOnMount: false
retry: false
cacheTime: 0

Explanation: refetchOnMount controls remount behavior.

Question 37: Why should mutations handle rollback?

For caching
For optimistic update recovery
For retries
For refetching

Explanation: Rollback restores UI on mutation failure.

Question 38: Which feature reduces unnecessary API calls most effectively?

cacheTime
staleTime
retry
enabled

Explanation: staleTime prevents frequent refetching.

Question 39: What is a common misuse of React Query?

Fetching server data
Managing client UI state
Using mutations
Invalidating queries

Explanation: UI state should remain local.

Back to programming Quizzes

React Query Quiz ( Intermediate )

Questions

~10

Minutes

Min Limit