reduce duplicate fetches for cache.json by storing in client.js memory

[thescientist13]

Type of Change

• New Feature Request
• Documentation / Website
• Improvement / Suggestion
• Bug
• Other (please clarify below)

Summary

As a minor optimization for client.js, it would be good to cache in memory previously fetched calls to cache.json.

Details

In this way, the browser won't have to make redundant HTTP requests to something it already has access to.

[hutchgrant]

You cannot cache them in client.js because it's not a singleton. A new instance is created every single route change, for each component that imports it.

[hutchgrant]

We can however reuse the <script data-state="apollo"></script> to hold our window.__APOLLO_STATE__ data. On route change currently, that data remains static from when the page was initially loaded(even that isn't being utlized at all). Could also utilize localstorage in the browser.

Modify client.js like so:

client.query = (params) => {

  if (APOLLO_STATE && Object.keys(APOLLO_STATE).length === 0) {

and it will use the apollo_state on initial page load. The problem is when the route changes, with this condition it will try to reach graphql server.

[thescientist13]

Basically if we provide client side routing of any kind (SPA / hybrid model), then we should expect to have to reload the whole page (app shell) if we want things to work as would expect in SSG mode (which would be doing a full page reload)

• <meta>
• <title>
• cache.json

Part of paying the cost to enable going beyond just progressive enhancement. But makes things simpler for at least achieve SSG mode. 😄

[thescientist13]

Moving to deferred for this project to be added to our next project, but it looks we can take advantage of the work being deon for adding an MPA setting in #477 to implement what we need for this feature.

More info here - #487 (comment)