DEV Community 👩‍💻👨‍💻

Samuel Durante for Woovi

Posted on

How to use the Relay fetch policy to ensure fast rendering?

One of the main tools of Woovi is Relay. Relay is a GraphQL Client designed for high performance on any scale. When performing one of your main operations, query, we use a hook called useLazyLoadQuery, this hook has a property called fetchPolicy, which defines whether the query will be made from the local cache (we call it "store") or whether it should be made from a network request (we call it "network").

The following definitions fetchPolicy are:


store-or-network is the default value, if data exists in the store, and is not obsolete, it won't do a network request, otherwise, it will do a network request.


Example: We can use it in high-flow places to save network requests. Consequently avoiding unnecessary requests.


store-and-network will use the data of the store, and always do a network request without making regardless.


Example: We can imagine the Instagram home, we can render outdated data while fetching new data.


network-only always will search the data making a network request.


Example: We need to render the balance of the customer, we can't render a balance out of date, so always we will make a new network request without considering the store.


store-only always will search the data of the store.


Example: We use store-only when we assume that this data already exists in the store, and we will not need the refetch.

If you want to work with us, we are hiring!

Top comments (0)

Take a look at this:


Go to your customization settings to nudge your home feed to show content more relevant to your developer experience level. 🛠