Prefetching/throttling Apollo Client?


I’m trying to ultimately achieve pre-fetching with Apollo and i’m not sure how to go about it and I can’t seem to find any info about this in the docs.

A simple example is to manually fetch seconds (or ms) before you need to consume it and when going to the next page, the connect fires the query again but gets the cached data instead of making another server request.

With my old setup of Redux and AJAX I can just dispatch the new response data before transitioning the router and the next page would have the cached data on initial render.


Are u able to props.refetch in a onBeforeRender method? (React specific but you see what I mean) onBeforeRended could be any lifecycle method.

p.s. I haven’t tried this


Not in this case but I could use the regular client.query method in the core API.


Oh I thought you were trying to re-populate the cache not call a new query :blush:


@SkinnyGeek1010 if you just call client.query at any time before, that query will be in the cache, and then when you display the UI component it will just get it immediately.

Let me know if that works!


@sashko ok great! can’t wait to try it out :slight_smile:

Would the connect make a (2nd) call again though? I imagine this would be around a few ms later. I guess it’s not a big deal to re-call again but was more less curious.


Nope! That’s what the forceFetch option is for. See here:


Ahhhhh ok that makes more sense now :slight_smile: I thought this was just for edge cases.

I’m all in :smile: Converting my ajax calls over to apollo client this week.
Thanks again and keep up the great work :beers:


Always happy to have a PR for the docs :]