Relay modern caching example

2020-07-13 10:16发布

问题:

I would like to enable caching in my react native application. I am using GraphQL with Relay modern. I found out that caching is not enabled by default in relay modern, but they have exposed RelayQueryResponseCache from relay-runtime, which we can add to the fetchQuery function in our API. I read discussion here and here about it, but have not seen any example to get started. Can someone help me out on this?

EDIT:

Ok I came up with a solution. I think it misses few things but so far it serves our needs. I have noticed that passing anything into QueryRenderer into cacheConfig results passing that value into fetchQuery function inside my environment. So I have created a Component which loads the data by some relation and resolves it into the correct json structure requested by the query. Then I return this into the state. Then I extended my Component which contains QueryRenderer with the created 'cache loader'. Now when componentWillMount() is called I ask for the cached data. During this I have set this.state.loading = true so I am able to handle loading state. Reading from DB is async. I am using this class in other components as well. Every one handles its cache data. I just pass it to QueryRenderer.

However I was thinking that this makes some extra logic need to add for each Component which is supported by this caching. Probably passing the cache resolver as cacheConfig and resolve the cached data immediately inside the environment would be much more cleaner.