React Query Tutorial in Hindi #7 What are staleTime and cacheTime in React Query

Subscribers:
10,200
Published on ● Video Link: https://www.youtube.com/watch?v=bMuJcfYsf0Q



Category:
Tutorial
Duration: 3:33
23 views
0


cacheTime relates to the expiration of a specific value, while staleTime will be expiring the validity of a certain query.

What is staleTime?

staleTime is the length of time before your data becomes stale. The default value in React Query is staleTime: 0 - which means your data is immediately stale!

In React Query, your data can be fresh or stale.

If it's fresh, the saved (cached) data will be used repeatedly, without more API calls to the server.

If data is stale, then fresh data gets fetched anytime the window refocuses, the component re-mounts, or the network reconnects.

staleTime is 0 by default, so data is never fresh. If you have server data that changes often, that's what you want. But if your data is fairly static, you might want to extend the staleTime on your query.

React Query V4: The Solution for Effortless Data Fetching

React Query will fetch the data with useQuery and store it in the cache with the key my-data. Because we've set the staleTime the data is fresh for 10 minutes.

When data is fresh, instead of fetching the data from the server again, React Query will keep using the data in the cache.

StaleTime: The duration until a query transitions from fresh to stale. As long as the query is fresh, data will always be read from the cache only - no network request will happen! If the query is stale (which per default is: instantly), you will still get data from the cache, but a background refetch can happen under certain conditions.
CacheTime: The duration until inactive queries will be removed from the cache. This defaults to 5 minutes. Queries transition to the inactive state as soon as there are no observers registered, so when all components which use that query have unmounted.Please do like share and comment if you like the video please do hit like and if you have any query please write it comment box
NestJs Tutorial https://www.youtube.com/watch?v=9F6Cv_JHmrE&list=PLsvvBhdpMqBxYq1kxZoGhIEISCmXN0Pe2

You can support me by buying a coffee for me

https://ko-fi.com/N4N0JZBBN


Please do subcribe my other video tutorials
React Native Tutorial : https://www.youtube.com/watch?v=9aN93sM6OJQ&list=PLsvvBhdpMqBx0f2T7The14FV2sthRo_L5
ReactJS Tutorial : https://www.youtube.com/watch?v=5kBISm01zHg&list=PLsvvBhdpMqBzPZ75UzwbIQrPYk6NmFWiW
Linux Tutorials : https://www.youtube.com/watch?v=cJ4RmxbS1VM&list=PLsvvBhdpMqBz3yff6mYLc9BlhI0YVP7ZS
Jquery Tutorial : https://www.youtube.com/watch?v=wvPzvVn13xU&list=PLsvvBhdpMqBz3lROu38xphPSGXEl27U1d
Html & Css Tutorial : https://www.youtube.com/watch?v=yHV-I96ESBE&list=PLsvvBhdpMqBw5pNIDYgsIyr9giWVWwA2M
Wordpress Tutorial : https://www.youtube.com/watch?v=oBsaz2cYx6c&list=PLsvvBhdpMqByMSHXyehbldHx0o3EtvGuh
Javascript Tutorial : https://www.youtube.com/watch?v=Zbyd31hq3g8&list=PLsvvBhdpMqBySsqQsvMkOd9SpKQ_R2HDo
Magento 2 Tutorials : https://www.youtube.com/watch?v=84dNyRoQthQ&list=PLsvvBhdpMqBz_3k14bYpYEIPFI4MQporp
Github Tutorials : https://www.youtube.com/watch?v=N9Dfs4gUMjc&list=PLsvvBhdpMqByiaj7F289-nO26iBYc9ot9
October CMS Tutorial : https://www.youtube.com/watch?v=jFD2VUAxu2o&list=PLsvvBhdpMqBz027a08LovCuCAnU6T7VZx
Bash Scripting Tutorial : https://www.youtube.com/watch?v=yFV2QK-x6vY&list=PLsvvBhdpMqBx_jsVKKzZ9-ZZUwae9t4x9
Jenkins Beginner Tutorial : https://www.youtube.com/watch?v=GHQ8C_2OZps&list=PLsvvBhdpMqBzdLDMiMkFP5BaPqlXVuk45
Apollo Client React Js : https://www.youtube.com/watch?v=vGZGIfDlcvE&list=PLsvvBhdpMqBwJ5OjdxNCY_sw3PcHAXQlm
Wordpress Tutorial In Hindi : https://www.youtube.com/watch?v=Wt5vePyARA0&list=PLsvvBhdpMqBxmFcIrpJo0pZNJ7mmpKYZt
MongoDb Tutorial : https://www.youtube.com/watch?v=Mab0Hrx-mVA&list=PLsvvBhdpMqBxTopKc6hsh7BvPDLu_Emlr
Bootstrap 5 Tutorial in Hindi : https://www.youtube.com/watch?v=k7xGbXkVHy4&list=PLsvvBhdpMqBy_aSBZdtSJVcqSMsUAR4H1
Xero Tutorial For Beginners : https://www.youtube.com/watch?v=MOQ1hpd8CtI&list=PLsvvBhdpMqBxr3PDAnUzHJLlHvjtLWaQt
React Material UI = https://www.youtube.com/watch?v=CWtjF2Rx8I8&list=PLsvvBhdpMqBydNg7wU4A__7Qp65TyyhjA
Thanks for watching
Vue Js Tutorial : https://www.youtube.com/watch?v=k4O9TaUi4-U&list=PLsvvBhdpMqBy5pnwspDeDJo9JEzF3PKTh
Angular 14 Tutorial : https://www.youtube.com/watch?v=P3llhzCYgHE&list=PLsvvBhdpMqBwCbR5M-r6uNcgQu2BxuuQ8
MongoDb Tutorial : https://www.youtube.com/watch?v=Mab0Hrx-mVA&list=PLsvvBhdpMqBxTopKc6hsh7BvPDLu_Emlr
Mysql Tutorial For Beginners : https://www.youtube.com/watch?v=8IUu3iv3EEA&list=PLsvvBhdpMqBwleiAGlJIoMDEpJsZJjJSI
AWS Tutorials: https://www.youtube.com/watch?v=1a8WBUiz5gk&list=PLsvvBhdpMqBwGEnT2km4xNIL6wXJoVrLK
Php Tutorial for Beginners : https://www.youtube.com/watch?v=fCCtMVrHH_c&list=PLsvvBhdpMqBx0CHzCANLull6KkTlLh3Ac
Nest

Have a Great Day !!!




Other Videos By Technical Rajni


2023-07-25BarCode Reader or Barcode Scanner App using React Native Vision Camera
2023-07-25React Native Vision Camera How to Take Snapshot
2023-07-25React Native Vision Camera How to Capture and Record Videos
2023-07-25How to Take Photo using React Native Vision Camera
2023-07-25React Native Deck Swiper | Awesome tinder like card Swiper for React Native
2023-07-23React Query Tutorial in Hindi #12 useQuery on click React Query
2023-07-23React Query Tutorial in Hindi #11 Polling React Query
2023-07-23React Query Tutorial in Hindi #10 Refetch Defaults React Query
2023-07-23React Query Tutorial in Hindi #9 Setting cacheTime and staleTime globally React Query
2023-07-23React Query Tutorial in Hindi #8 Why should cacheTime be bigger than staleTime in React Query
2023-07-23React Query Tutorial in Hindi #7 What are staleTime and cacheTime in React Query
2023-07-23React Query Tutorial in Hindi #6 React Query Stale Time
2023-07-23React Query Tutorial in Hindi #5 React Query Devtools
2023-07-23React Query Tutorial in Hindi #4 React Query Handling Query Error
2023-07-23React Query Tutorial in Hindi #3 React Query Fetching Data with useQuery
2023-07-23React Query Tutorial in Hindi #2 React Query Project Setup
2023-07-23React Query Tutorial in Hindi #1 React Query Introduction
2023-07-22React Tutorial in Hindi #65 Cart Functionality in React with Context API
2023-07-22React Tutorial in Hindi #64 The React useContext Hook
2023-07-22React Tutorial in Hindi #63 How to use react-icons to install Font Awesome in a React app
2023-07-21NestJS API CRUD Operation Using PostgreSQL



Tags:
react query
react query tutorial
react
react query for beginners
react query tutorial for beginners
react tanstack query
react query cache
react tutorial
react query in hindi
react data fetching
react query tutorial in hindi
react query hindi
react and node
react query refetch
react query stale time
react query 2022
tanstack react query
react query introduction
staletime cache time react query
react query maxwell
tanstack query
react query v4