I was wondering to use paypal's React Engine (https://github.com/paypal/react-engine), but I have some doubts:
What are the benefits over other template engines like Handlebars?
Why upload .jsx files, and not (jsx precompiled/transformed) .js files? (This one should be faster because don't have to do deal with the transformation at the server).
I have been researching but I get confused.
Thanks
The main difference between
react-engine
and template engines is only when the browser enables the user to interact with the browser page. Nevertheless, it is important how machines have access to individual data.Assuming we want to run a simple webpage. Just a scrolling and open text information. Using template engines, like Handlebars.js, typically, when the browser request hits to the server, it tries to figure it out how to respond and what to do. That said, the template engine may reference existing fetched data from files stored into a local and accessible source. Those are loading all the defined data regarding the site template file (i.e.
head
,meta
,title
, etc.), with a render of incomplete HTML string. This HTML is then sent back to the Browser and rendered.The
react-engine
, on the same side it happens the use of the same rendering mechanism. However, instead of a template engine semantic, it usesJSX
, or if we want, we can also useJavaScript
. TheJSX
is, therefore, broader then template engines. A great article by Hajime Yamasaki Vukelic complies the separation of concerns from a different angle between JSX and HTML templates.So far so good, there is no relevant difference between both solutions. Links to next or previous simple webpage are just simple
<a href="/webpage>Next</a>
elements.At the moment, when we decide to implement some interactions,
react-engine
will be the winner. Whilereact-engine
rendering does not requireJavaScript
to run on the client side, it will enable SEO over the search.Template engines also have this SEO support, but with less impact. We can not run here all
JavaScript
to render HTML. Even libraries likejQuery
require live access to the browser window object which cannot be mocked easily on the server side. So template engines become less productive.In conclusion, template engines can do the same as
react-engine
rendering. Maybe not equally easy or equally fast but both tools are qualified. You can also read another great thread on this topic.