Waiting on Meteor Method data, with Flow-Router SSR and Fast-Render

[SachaG]

This is a complex issue but I'll try to describe it. With collection data, we have the following flow when we make a new request:

• Simulate the subscription in React Komposer on the server.
• Flow-Router SSR gets the data on the server and generates markup.
• Show SSR-generated markup.
• Fast-Render gets the data on the server and injects it in the document.
• Subscribe instantly in React Komposer on the client.
• Show app.

This means that when the user loads the app, A) the page is immediately populated with the server-generated markup and B) Minimongo is immediately populated with the fast-render generated data. So (if I'm not mistaken) Meteor.subscribe('posts').ready() in React Komposer will always return true on first load, and that's what we're not seeing any loading screens when using Flow-Router SSR.

Now if the data is instead coming from a method, this doesn't quite work as well. Let's say that you have a single value stored on the server you want to make available to your whole app before it's loaded (in my case, the server timezone).

First of all Meteor.call is not reactive, so we have to use reactive method instead.

But even so, we have the issue that there is no Fast-Render equivalent for methods or arbitrary variables. So if we want to wait for the result of this method, we can't bypass our "loading…" screen, which defeats the point of having SSR in the first place.

In other words, with a method the flow becomes:

• Simulate the method call in React Komposer on the server.
• Flow-Router SSR gets the method data on the server and generates markup.
• Show SSR-generated markup.
• Subscribe in React Komposer on the client.
• Show loading. (bad!)
• Subscription is ready
• Show app.

I'm not sure how I can get around this, apart from not using methods at all… Any ideas?

[SachaG]

OK, so I think the solution is to use the inject-initial package instead of methods, in order to make the data available right from the start.

The only problem is that I don't see a way to send authenticated data using this method (i.e. data that is not part of a collection, but is only available depending on the current user) but it shouldn't matter for my use case.

[lmachens]

Can you take a look at https://github.com/kadirahq/flow-router/issues/655 ? Looks like it is a similar problem.

[sahanDissanayake]

So @SachaG did you find a solution please ?

[SachaG]

I did find a workaround, see above.

[sahanDissanayake]

So with React FlowRouter SSR initial data is already injected to the page. so I dont know why I should use something like this again ?

Did you had the same issue as described here ? https://github.com/kadirahq/flow-router/issues/655

[sahanDissanayake]

<script type="text/inject-data">%7B%22fast-render-

[SachaG]

FlowRouter SSR will inject two things:

1) the HTML markup 2) the initial collections data (via fast-render)

My use case was that I needed to access some other arbitrary piece of dynamic data that was not stored in a collection. So it's different from the issue you refer to, which concerns collection data.

[sahanDissanayake]

Right. Ok thanks.. I knew 30% my issue would be different.