Isomorphic React, advantages of prerender.io over react-engine?

Question

I've seen prerender.io is a solution based on phantom.js while paypal's react-engine seems lighter solution. I need to decide which one to use.
What is the advantages of prerender.io over react-engine ? for SPA and no SPA.

Answer 1

If you're building an isomorphic react application, then react-engine or your own way of rendering the initial page is more than enough.

In case you're okay to go with a paid service like prerender.io, then it will do the same using headless webkit browser such as phantom.js. Prerender.io opens the webpage in a headless webkit browser such as phantomjs and returns the rendered HTML to the search engines. In the process, it caches the rendered HTML. So subsequent requests would be served faster. It's useful for almost all SPA applications built using AngularJS, Backbone, etc.

But for react, I would consider it to be an overkill and also paid service is not required when you could do it easily. React provides you API to render the Component in the server easily using React.renderToString and React. renderComponentToStaticMarkup

Very simple approach looks like below:

 Router.run(routes, url , function(Handler, routerState) {
        var handlerElement = React.createElement(Handler);
        var html = React.renderToString(handlerElement);
        res.send(html);
    });

It's just a snippet from an isomorphic app which i've built recently.

You could refer ConMAN an isomorphic reactjs app which I've built using the following tech stack: Koa, React, React-router, Flux Architecture and Browserify.

Answer 2

Keep in mind that isomorphic architecture in React apps adds some complexity, compare these two projects for example (disclaimer: I'm the author):

https://github.com/kriasoft/react-starter-kit - Isomorphic React app
https://github.com/kriasoft/react-static-boilerplate - Single-page React app (SPA)