A brief review of the React.js framework, for those wondering whether to use it or not
At the moment, I’m developing a website from scratch for artists to upload commission portfolios and a bunch of other things, and as part of that, I looked into React.js as something to potentially help simplify building the front end. I thought it’d be a good idea to write a bit about what I learned, having done the tutorial and set it up to work correctly in a production environment.
You can find React here.
What exactly does React do?
I think this is rather misleading. Technically, you *can* use very little React in your project and it’s not difficult to use it for testing, but the overhead necessary to make it work in production is almost inevitably not going to be worth it unless your project is complex. React is much more suited to heavy-duty, complex UI projects than any form of simple website, and I will explain why below.
Why is React mainly suited to heavy-duty projects?
There are two primary reasons.
If you’re just starting out, the React website points out that simply using a <script src> at the top of your page including the Babel preprocessor is fine. However, this is very slow in production, for reasons experienced developers should understand. Imagine every time you wanted to run an application on your computer, you had to compile it every time first; that would be awfully slow and inefficient. It makes a lot more sense to compile it once and then run it as many times as you want.
This means that in production, React.js needs several things to function properly:
- Node.js and npx installed
- Babel installed
That isn’t always the easy process it sounds like, especially if you’re e.g. working with a pre-configured tech stack, and is a lot of extra effort if you’re only building something of a relatively simple nature.
2: Lack of benefit to non-complex UIs
With its functionality of being able to neatly render complex HTML elements, subclass them and so forth, React is a very helpful tool if you are building a complex UI with a great deal of features. For many simpler websites however, where subclassing UI components and the like isn’t necessary, React offers little that echoing content in PHP doesn’t achieve on its own.
It’s probably worth pointing out here that Node.js and React are both known to have better performance than PHP does. For large projects, this is another reason why they can be considered good choices, but for anything less than a complex UI or a site with immensely heavy traffic the difference is going to be negligible.
From what I’ve seen, React is a very good choice to consider if you intend on making a very complex UI that requires a lot of classes and subclasses; echoing content in PHP can get difficult to maintain given it’s all in strings, and being able to subclass a component in the manner React does is very handy.
However, I wouldn’t bother with it if you have anything less than a complex UI to implement. It adds too much overhead and complexity to be worth it unless you will make extensive use of its features.