cult-of-coders / grapher

Grapher: Meteor Collection Joins + Reactive GraphQL like queries
https://atmospherejs.com/cultofcoders/grapher
MIT License
275 stars 53 forks source link

Offer support for Named/ Normal Queries and Meteor/Server-Render #199

Open theodorDiaconu opened 6 years ago

theodorDiaconu commented 6 years ago

Problem

We need our applications to render instantly, regardless of the page we are accessing. Currently this is supported by Meteor with their server-render and later hydration of React.

However, Grapher Queries need to act isomorphic and fetch (whether they are reactive or not, server-side) and not result in a flicker server-side.

Tackling the Beast

This solution may need continuation on the grapher-{viewlayer} packages.

Make the query server subscription API isomorphic on server, meaning a subscribe would return a dummy handle that is always ready.

If we are rendering server-side, we need to have a window.Grapher.QueryStore which holds our fetched data from the server. We also need to be user-aware when we perform these fetches on the server. Since the server has access to everything, we need to be careful not to expose any information we don't want in that initial rendering, this means that the fetching needs to be blended somehow with userId.

Questions

Shouldn't this be the problem of grapher-{viewlayer} to solve ?

Server Rendering

query.subscribe() => {ready() => true} query.fetch() => {results based on current userId}

getQueryId(query) => Uniquely identifies a query.

=> window.Grapher.QueryStore[queryId] = { reactive: Boolean, data: [] }

Client Hydration

Reactive Queries:

query.subscribe() => checks if there is a QueryStore for it's id, if yes it returns a wrapper over .ready(), and once it's ready() QueryStore gets deleted

Static Queries: When rendering, we need to check for the queryStore and return results immediately, and avoid another database fetch, and imediatelly delete the QueryStore[id]

abecks commented 6 years ago

Hey @theodorDiaconu,

I'm maintaining FastRender and recently added a bunch of SSR data hydration functionality in the latest release.

I'd love to take what I've learned there and help Grapher achieve this goal. I'm new to Grapher, but it looks great! Can you provide me with any direction for adding this feature?

FastRender creates Meteor.subscribe on the server and tracks all subscriptions and their fetched data this way. It has no support for static queries. However, how it tracks subscriptions and rehydrates them on the client may be of use here.

erixtekila commented 4 years ago

Any news on this ?