Fast-Render with Mantra Architecture?


#1

Hi,

I have an application with the Mantra Architecture.
I use FlowRouter for the routing.

I want to add fast-render to speed up the page loading
(https://github.com/kadirahq/fast-renderhttps://github.com/kadirahq/fast-render).

It’s possible with the mantra architecture ? How to change the route.jsx to deals with fast render ?

Thanks.


#2

Flow Router supports Fast-render out of the box. It should be as easy as just adding the package. There shouldn’t be any need for special configuration.


#3

The problem is that the route.js is in the client folder.
FastRender need the route.js to be in a shared folder (i.e. : lib/).

I try to put the route.js in the lib folder, but it does’nt work, module doesn’t load…

Route.js in mantra looks like this : Route.js
Mantra inject deps and flowrouter etc… so in the client.

I don’t know how to handle with this on the lib content. I’m not familiar with that :confused:


#4

That is a good point. You can try asking @arunoda directly or at Mantra Talk.


#5

I posted in the mantra talk :slight_smile:

https://talk.mantrajs.com/t/fast-render-with-mantra-architecture/450?u=themandunord


#6

You just have to set up some routes on the server using fast-render’s API.


#7

The following APIs are available on the server only

:confused:


#8

On this link, you can see that FlowRouter SSR was added to the mantra kickstater.

For that, the developer add the Route.jsx in the both folder.

But we cannot import module from the client folder, isn’t it ?

So the developer says that he use a symlink to deals with the problem… it is a good solution ?

To get it to work you need to create a symlink ‘app’ pointing to ‘client’

So I don’t know how to put this route.js for use FastRender… :sob:


#9

Right. You need to make routes on the server.

You have routes on the client and routes on the server. So…

Client:

FlowRouter.route('/blog/:postId', {
    action(params, queryParams) {
        // Render your template
    }
});

Server:

FastRender.route('/blog/:postId', function(params) {
  // Subscribe to some publication
  this.subscribe('post', params.postId);
})

The client route tells you what template to render, and the server route tells you what data to fast render.


#10

Sorry but I don’t understand :confused:

My subscriptions are on the client side for the moment. And I don’t use the subscription with FlowRouter.
The subsciption is in the component container (With the Mantra Architecture)

So, in the server, if I put :

FastRender.route('/blog/:postId', function(params) {
   // Subscribe to some publication
   this.subscribe('post', params.postId);
})

I don’t need to put the subscription code in the client container ?


#11

Nope. Its not actually doing a subscription. It’s just saying “for this route fast render the data returned from this publication”

When you subscribe on the client (in the template or whatevet) the data will already be there. You can actually see it in the raw html when you view source in the browser.

Try it out with the fast render debug tools. You can actually load the page with data without a ddp connection.


#12

Sorry… to clarify. You still need to subscribe on the client ( in your case inside your react component ). The fast render route doesnt do that part for you. It just tells the server what data to send when the app first loads.


#13

Ok, thanks I will try this when I have time (in 1-2 days) !

Try it out with the fast render debug tools

What it is ? It’s this ?


#14

It’s all in the docs. https://github.com/kadirahq/fast-render#debugging

I’d really suggest reading them.


#15

Thanks @moberegger, it’s work :slight_smile: