title: Relay modern caching example
body: <p>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 <code>RelayQueryResponseCache</code> from <code>relay-runtime</code>, which we can add to the <code>fetchQuery</code> function in our API. I read discussion <a href="https://github.com/facebook/relay/issues/1719" rel="nofollow noreferrer">here</a> and <a href="https://github.com/facebook/relay/issues/1687#issuecomment-296842575" rel="nofollow noreferrer">here</a> about it, but have not seen any example to get started. Can someone help me out on this?</p>
  
  <p><strong>EDIT:</strong></p>
  
  <p>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 <code>QueryRenderer</code> into <code>cacheConfig</code> results passing that value into <code>fetchQuery</code> function inside my environment. 
  So I have created a <code>Component</code> which loads the data by some relation and resolves it into the correct <code>json</code> structure requested by the query. Then I return this into the state. Then I extended my <code>Component</code> which contains <code>QueryRenderer</code> with the created 'cache loader'. Now when <code>componentWillMount()</code> is called I ask for the cached data. During this I have set <code>this.state.loading = true</code> 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 <code>QueryRenderer</code>. </p>
  
  <p>However I was thinking that this makes some extra logic need to add for each <code>Component</code> which is supported by this caching. Probably passing the cache resolver as <code>cacheConfig</code> and resolve the cached data immediately inside the environment would be much more cleaner. </p>