Simple persistence for all Apollo Client 3.0 cache implementations, including
InMemoryCache
and Hermes
.
Supports web and React Native. See all storage providers.
npm install --save apollo3-cache-persist
or
yarn add apollo3-cache-persist
To get started, simply pass your Apollo cache and an
underlying storage provider to persistCache
.
By default, the contents of your Apollo cache will be immediately restored (asynchronously, see how to persist data before rendering), and will be persisted upon every write to the cache (with a short debounce interval).
import AsyncStorage from '@react-native-async-storage/async-storage';
import { InMemoryCache } from '@apollo/client/core';
import { persistCache, AsyncStorageWrapper } from 'apollo3-cache-persist';
const cache = new InMemoryCache({...});
// await before instantiating ApolloClient, else queries might run before the cache is persisted
await persistCache({
cache,
storage: new AsyncStorageWrapper(AsyncStorage),
});
// Continue setting up Apollo as usual.
const client = new ApolloClient({
cache,
...
});
import { InMemoryCache } from '@apollo/client/core';
import { persistCache, LocalStorageWrapper } from 'apollo3-cache-persist';
const cache = new InMemoryCache({...});
// await before instantiating ApolloClient, else queries might run before the cache is persisted
await persistCache({
cache,
storage: new LocalStorageWrapper(window.localStorage),
});
// Continue setting up Apollo as usual.
const client = new ApolloClient({
cache,
...
});
See a complete example in the web example.
Want to make the project better? Awesome! Please read through our Contributing Guidelines.
We all do this for free... so please be nice 😁.