You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
Copy file name to clipboardExpand all lines: docs/src/pages/guides/migrating-to-react-query-4.md
+16Lines changed: 16 additions & 0 deletions
Display the source diff
Display the rich diff
Original file line number
Diff line number
Diff line change
@@ -132,6 +132,22 @@ If you were importing anything from `'react-query/react'` directly in your proje
132
132
+ import { QueryClientProvider } from 'react-query/reactjs';
133
133
```
134
134
135
+
### `persistQueryClient` and the corresponding persister plugins are no longer experimental and have been renamed
136
+
137
+
The plugins `createWebStoragePersistor` and `createAsyncStoragePersistor` have been renamed to [`createWebStoragePersister`](/plugins/createWebStoragePersister) and [`createAsyncStoragePersister`](/plugins/createAsyncStoragePersister) respectively. The interface `Persistor` in `persistQueryClient` has also been renamed to `Persister`. Checkout [this stackexchange](https://english.stackexchange.com/questions/206893/persister-or-persistor) for the motivation of this change.
138
+
139
+
Since these plugins are no longer experimental, their import paths have also been updated:
140
+
141
+
```diff
142
+
- import { persistQueryClient } from 'react-query/persistQueryClient-experimental'
143
+
- import { createWebStoragePersistor } from 'react-query/createWebStoragePersistor-experimental'
144
+
- import { createAsyncStoragePersistor } from 'react-query/createAsyncStoragePersistor-experimental'
145
+
146
+
+ import { persistQueryClient } from 'react-query/persistQueryClient'
147
+
+ import { createWebStoragePersister } from 'react-query/createWebStoragePersister'
148
+
+ import { createAsyncStoragePersister } from 'react-query/createAsyncStoragePersister'
Copy file name to clipboardExpand all lines: docs/src/pages/plugins/createAsyncStoragePersister.md
+13-15Lines changed: 13 additions & 15 deletions
Display the source diff
Display the rich diff
Original file line number
Diff line number
Diff line change
@@ -1,25 +1,23 @@
1
1
---
2
-
id: createAsyncStoragePersistor
3
-
title: createAsyncStoragePersistor (Experimental)
2
+
id: createAsyncStoragePersister
3
+
title: createAsyncStoragePersister
4
4
---
5
5
6
-
> VERY IMPORTANT: This utility is currently in an experimental stage. This means that breaking changes will happen in minor AND patch releases. Use at your own risk. If you choose to rely on this in production in an experimental stage, please lock your version to a patch-level version to avoid unexpected breakages.
7
-
8
6
## Installation
9
7
10
-
This utility comes packaged with `react-query` and is available under the `react-query/createAsyncStoragePersistor-experimental` import.
8
+
This utility comes packaged with `react-query` and is available under the `react-query/createAsyncStoragePersister` import.
11
9
12
10
## Usage
13
11
14
-
- Import the `createAsyncStoragePersistor` function
15
-
- Create a new asyncStoragePersistor
12
+
- Import the `createAsyncStoragePersister` function
13
+
- Create a new asyncStoragePersister
16
14
- you can pass any `storage` to it that adheres to the `AsyncStorage` interface - the example below uses the async-storage from React Native
17
15
- Pass it to the [`persistQueryClient`](./persistQueryClient) function
Copy file name to clipboardExpand all lines: docs/src/pages/plugins/createWebStoragePersister.md
+14-16Lines changed: 14 additions & 16 deletions
Display the source diff
Display the rich diff
Original file line number
Diff line number
Diff line change
@@ -1,23 +1,21 @@
1
1
---
2
-
id: createWebStoragePersistor
3
-
title: createWebStoragePersistor (Experimental)
2
+
id: createWebStoragePersister
3
+
title: createWebStoragePersister
4
4
---
5
5
6
-
> VERY IMPORTANT: This utility is currently in an experimental stage. This means that breaking changes will happen in minor AND patch releases. Use at your own risk. If you choose to rely on this in production in an experimental stage, please lock your version to a patch-level version to avoid unexpected breakages.
7
-
8
6
## Installation
9
7
10
-
This utility comes packaged with `react-query` and is available under the `react-query/createWebStoragePersistor-experimental` import.
8
+
This utility comes packaged with `react-query` and is available under the `react-query/createWebStoragePersister` import.
11
9
12
10
## Usage
13
11
14
-
- Import the `createWebStoragePersistor` function
15
-
- Create a new webStoragePersistor
12
+
- Import the `createWebStoragePersister` function
13
+
- Create a new webStoragePersister
16
14
- Pass it to the [`persistQueryClient`](./persistQueryClient) function
Copy file name to clipboardExpand all lines: docs/src/pages/plugins/persistQueryClient.md
+22-24Lines changed: 22 additions & 24 deletions
Display the source diff
Display the rich diff
Original file line number
Diff line number
Diff line change
@@ -1,28 +1,26 @@
1
1
---
2
2
id: persistQueryClient
3
-
title: persistQueryClient (Experimental)
3
+
title: persistQueryClient
4
4
---
5
5
6
-
> VERY IMPORTANT: This utility is currently in an experimental stage. This means that breaking changes will happen in minor AND patch releases. Use at your own risk. If you choose to rely on this in production in an experimental stage, please lock your version to a patch-level version to avoid unexpected breakages.
6
+
`persistQueryClient` is a utility for persisting the state of your queryClient and its caches for later use. Different **persisters** can be used to store your client and cache to many different storage layers.
7
7
8
-
`persistQueryClient` is a utility for persisting the state of your queryClient and its caches for later use. Different **persistors** can be used to store your client and cache to many different storage layers.
This utility comes packaged with `react-query` and is available under the `react-query/persistQueryClient-experimental` import.
15
+
This utility comes packaged with `react-query` and is available under the `react-query/persistQueryClient` import.
18
16
19
17
## Usage
20
18
21
-
Import the `persistQueryClient` function, and pass it your `QueryClient` instance (with a `cacheTime` set), and a Persistor interface (there are multiple persistor types you can use):
19
+
Import the `persistQueryClient` function, and pass it your `QueryClient` instance (with a `cacheTime` set), and a Persister interface (there are multiple persister types you can use):
@@ -52,29 +50,29 @@ You can also pass it `Infinity` to disable garbage collection behavior entirely.
52
50
53
51
As you use your application:
54
52
55
-
- When your query/mutation cache is updated, it will be dehydrated and stored by the persistor you provided. **By default**, this action is throttled to happen at most every 1 second to save on potentially expensive writes to a persistor, but can be customized as you see fit.
53
+
- When your query/mutation cache is updated, it will be dehydrated and stored by the persister you provided. **By default**, this action is throttled to happen at most every 1 second to save on potentially expensive writes to a persister, but can be customized as you see fit.
56
54
57
55
When you reload/bootstrap your app:
58
56
59
-
- Attempts to load a previously persisted dehydrated query/mutation cache from the persistor
57
+
- Attempts to load a previously persisted dehydrated query/mutation cache from the persister
60
58
- If a cache is found that is older than the `maxAge` (which by default is 24 hours), it will be discarded. This can be customized as you see fit.
61
59
62
60
## Cache Busting
63
61
64
62
Sometimes you may make changes to your application or data that immediately invalidate any and all cached data. If and when this happens, you can pass a `buster` string option to `persistQueryClient`, and if the cache that is found does not also have that buster string, it will be discarded.
0 commit comments