environmental-rose•2d ago
rapid refetching
i am trying to do rapid refetching of useList hook, and seems like it has a delay of around 5 seconds. meaning that if i refetch once, then try to refetch again after 3 seconds, it doesn't actually perform a network request. how come?
5 Replies
Hi @biohazard#1521. I'm kapa.ai, your friendly support bot. I will try to answer your question by searching through the knowledge base. :wave:
----------------------
The behavior you're observing is due to Refine's default caching strategy, which is inherited from React Query. By default, Refine sets a cache time of 5 minutes (300,000 ms) and a stale time of 0 seconds for queries. This means:
- When you call
refetch, if the data is still considered "fresh" (within the cache time), React Query will serve the cached data and may not perform a new network request.
- If you try to refetch within 5 minutes of the last fetch, the cached data is used, and a network request is not triggered unless the data is marked as stale or you explicitly invalidate the cache.
You can adjust this behavior by setting the staleTime and cacheTime in the queryOptions property of your useList hook. Setting staleTime: 0 ensures that data is always considered stale and will trigger a network request on each refetch. If you want to reduce the cache time, you can set cacheTime to a lower value as well.
Example:
This configuration will ensure that every call to refetch triggers a network request, regardless of how frequently you call it.
For more details, see the section on state management and caching in Refine's documentation: General Concepts: State Management.
----------------------
Note: you can ask me a follow up question by @ mentioning me again :speech_balloon:
----------------------<@680514070167683118> Kapa.ai is still learning and improving, please let me know how I did by reacting below.
environmental-roseOP•2d ago
@kapa.ai i have this useList:
useList<InboundEmailResponseDto>({
resource: 'mailbox',
pagination: {
pageSize: options?.pageSize || 20,
current: 1,
},
sorters: [
{ field: 'receivedAt', order: 'desc' },
],
filters: queryFilters,
meta: {
endpoint: parameters.api.endpoints.adminResources.mailbox.emails,
},
queryOptions: {
enabled: options?.enabled ?? true,
cacheTime: 0,
staleTime: 0,
},
});
};
and it still only works like 5 seconds after the first call. how can this be?
Let me check the knowledge base for you again. One moment! :books:
----------------------
Based on the knowledge sources, your configuration of
If you have already set
The knowledge sources do not explicitly explain a 5-second delay with your current settings. With
cacheTime: 0 and staleTime: 0 in the queryOptions for useList should, in theory, cause every call to refetch to trigger a network request immediately, with no caching or delay. This is consistent with how React Query (which Refine uses under the hood) is documented to work: setting both values to 0 disables caching and always treats data as stale, so every refetch should hit the network General Concepts: State Management.
However, you are still experiencing a delay of about 5 seconds before a new network request is made. The knowledge sources do not provide a direct explanation for this behavior, but there are a few relevant points:
- By default, Refine sets a cache time of 5 minutes and a stale time of 0 seconds, but you have overridden these defaults.
- There have been issues reported in the past where duplicate or unexpected requests occur due to how the signal property is accessed in the query function, or due to component remounting and strict mode in React. For example, in this issue, it was found that accessing the signal property in the query function could affect request behavior, and strict mode could cause duplicate requests.
- If the query key changes (for example, if any of the properties passed to useList change), a new request should be triggered regardless of cache settings useList Properties.
Given your settings, the 5-second delay is unexpected and not explained by the documented caching behavior. It may be caused by:
- An internal debounce or throttling mechanism (not documented in the provided sources).
- Some side effect of how the query function is implemented, especially if it accesses the signal property or if the component is remounting in a way that affects query execution.
- A bug or edge case in Refine or React Query, as discussed in the referenced GitHub issues.
Recommendation:If you have already set
cacheTime: 0 and staleTime: 0 and are still seeing this behavior, it may be worth checking for:
- Unintentional memoization or batching in your component.
- Whether the query key is truly changing between calls.
- Any custom logic in your data provider or API that could be rate-limiting requests.
If none of these apply, you may be encountering a bug similar to those discussed in the GitHub issues. In that case, consider opening an issue with a minimal reproducible example for further investigation by the Refine team.
Summary:The knowledge sources do not explicitly explain a 5-second delay with your current settings. With
cacheTime: 0 and staleTime: 0, every refetch should trigger a network request immediately. If this is not happening, it may be due to an undocumented internal mechanism or a bug General Concepts: State Management, useList Properties, GitHub Issue: useSelect hook ignores staleTime.
----------------------
Note: you can ask me a follow up question by @ mentioning me again :speech_balloon:
----------------------<@680514070167683118> Kapa.ai is still learning and improving, please let me know how I did by reacting below.