I don't have much experience with Ember, but I have a spent a lot of professional time with React development, well over a year now. Initially I quite loved it but that love affair is over.
My problem with React aren't complaints about front-end tooling and build systems. My problem with React is its emphasis on a tree like relationship among components. This is an unnatural paradigm for application development. Certainly user interfaces can be thought of in the form of a tree, but another way to think about application development is to consider the view a canvas, with areas to fill in.
React's strong tree type architecture makes some forms of common user interface development feel unnatural and ungainly, things like modals, toasts, or things that just don't fit into a neat little area of the screen in a sibling child parent relationship. Also anything that happens after a render, like animation, also has the same kind of unnatural cludgy development process and I often have found myself fighting what to render when with shouldComponentUpdate.
I'm not saying these things are impossible or even hard, it's that they're unnecessarily ungainly when those things should be simple. I've also think in practice that components far down the React tree become second class citizens, the source of bugs, less well designed and often quite dependent and highly coupled with parent elements.
Another problem I have is tooling related, it's the wave updates that you have to deal with whenever React updates. React and many well maintained libraries do this really well but there's always some bad actor in the ecosystem that makes it a pain and frankly I never look forward to a new React version. Again I understand that all these things are problems that can be overcome and I have, but I'm frankly over it.
I know I'll probably be writing React based applications for an employer for a very long time, but I would no longer recommend it. I think vue.js is a promising new library. I think there are things to be said about how React is very good about enforcing modular component development and I quite like flux and redux, but React in general. React is just not great.
"things like modals, toasts, or things that just don't fit into a neat little area of the screen in a sibling child parent relationship"
That's actually where React is very strong compared to other functional-style UI frameworks (eg: Elm's). Portals in React are really elegant and makes dealing with modals and toasts (or anything that doesn't fit in this model) quite nice.
I was working today with someone who was making a browser extension to inject stuff in host pages (think something like LastPass or those rulers for designers).
We made a set of components that create arbitrary elements at arbitrary locations, or highjack existing ones, and from there you get to manipulate things like you would any other functional-style UI. It's quite lovely (all thanks to the lifecycle hooks and React's ability to render subtrees anywhere on the screen). Very few tools do it as well as React does, otherwise I'd be writing Elm all day instead of JavaScript.
You're achieving that with separate calls to render. In an ideal React application you only have a single render call. So no, you're not demonstrating a good use of React and you're certainly not showing this to be a strength in React. Imagine, you wouldn't call react.render from inside an existing React component. That's ridiculous.
My problem with React aren't complaints about front-end tooling and build systems. My problem with React is its emphasis on a tree like relationship among components. This is an unnatural paradigm for application development. Certainly user interfaces can be thought of in the form of a tree, but another way to think about application development is to consider the view a canvas, with areas to fill in.
React's strong tree type architecture makes some forms of common user interface development feel unnatural and ungainly, things like modals, toasts, or things that just don't fit into a neat little area of the screen in a sibling child parent relationship. Also anything that happens after a render, like animation, also has the same kind of unnatural cludgy development process and I often have found myself fighting what to render when with shouldComponentUpdate.
I'm not saying these things are impossible or even hard, it's that they're unnecessarily ungainly when those things should be simple. I've also think in practice that components far down the React tree become second class citizens, the source of bugs, less well designed and often quite dependent and highly coupled with parent elements.
Another problem I have is tooling related, it's the wave updates that you have to deal with whenever React updates. React and many well maintained libraries do this really well but there's always some bad actor in the ecosystem that makes it a pain and frankly I never look forward to a new React version. Again I understand that all these things are problems that can be overcome and I have, but I'm frankly over it.
I know I'll probably be writing React based applications for an employer for a very long time, but I would no longer recommend it. I think vue.js is a promising new library. I think there are things to be said about how React is very good about enforcing modular component development and I quite like flux and redux, but React in general. React is just not great.