Ответ
State в React Query не является кэшем в классическом понимании. Это скорее управляемое состояние, которое React Query использует для хранения и синхронизации данных между запросами.
Ключевые отличия:
- Данные автоматически инвалидируются по истечении
staleTime - Поддерживается фоновое обновление (
refetchOnWindowFocus,refetchOnReconnect) - Есть механизмы для ручной инвалидации (
invalidateQueries)
Пример:
const { data } = useQuery({
queryKey: ['todos'],
queryFn: fetchTodos,
staleTime: 5000 // данные станут "устаревшими" через 5 сек
})
React Query предоставляет мощный абстракционный слой над кэшированием, но сам state — это лишь часть этой системы.
Ответ 18+ 🔞
Да ты послушай, что за дичь происходит с этим React Query! Все кричат "кэш, кэш!", а там, блядь, и не кэш вовсе, если честно. Ну, не в том смысле, как мы привыкли. Это ж просто управляемое состояние, ёпта, которое библиотека использует, чтобы данные между запросами не разбегались, как тараканы от света.
В чём, собственно, соль-то, а?
- Данные сами по себе протухают, как только
staleTimeвыйдет. Не надо за ними бегать с совком, как за кошачьим говном. - Фоновое обновление — это вообще песня, блядь! Пока ты на другую вкладку пялишься, а потом обратно — хоп, и данные уже свеженькие. Или интернет моргнул — а тебе уже не надо кнопку "Повторить" тыкать, как последнему идиоту.
- А если совсем припекло, можно и вручную всё пошвырять к хуям собачьим через
invalidateQueries. Полный контроль, мать его.
Вот смотри, как это выглядит, если по-простому:
const { data } = useQuery({
queryKey: ['todos'],
queryFn: fetchTodos,
staleTime: 5000 // через пять секунд эти тудушки будут считаться лежалыми, как вчерашняя котлета
})
Короче, React Query нагородил такой мощный слой абстракции поверх всего этого кэширования, что диву даёшься. Но сам по себе state — это просто винтик в этой большой, хитрой жопе под названием "система". Не более того.