Performance of react-template-helper?

I want to gradually transform my Blaze app into a React app. Since FlowRouter does not support the mix of BlazeLayout and react-mounter, the only way to mount React components in my app is via react-template-helper.

After having looked at the resulting code, I realized that for every occurence of a {{> React}} helper, a new react-root is created. I am wondering how performant this approach is if a lot of mixed components (Blaze and React) appear on the same page.

Does anybody have experiences with larger “mixed” apps?

1 Like

This is like really late - sorry 'bout that - but I have had a really good experience mixing React and Blaze using react-template-helper.

Still do Meteor 1.7 and React 16 (make sure you update react-template-helper to pick up the expanded modules check that includes React 16)

I find the react components tend to be really simple - everything they need is provided by the Blaze template including reactive data sources which auto-update props when they change very nicely. No need for MOBX or Redux so far.

And, since the react components are rather dumb, they are really easy to test because you’re not mixing data access into the component.

So the way I look at is I build all my simple stuff in Blaze then dive into React for those portions of the app that require more control. For example, I used to depend on Autoform - now I just create a React component for most form stuff where it needs it - like complex validations etc or hide/show logic.