We compared React with Vue last month and we declared React the winner. In this article, we will tell you why it became the king of development in such short time and what are its great advantages.
First of all, let’s see how it became so popular:
React works as a bond between the developer and the real browser, having its own virtual browser. Working with the DOM API becomes easier that way.
It also allows developers to describe their UIs and model them. Meaning, from now on, developers will only describe the final state of the interfaces, just like a function. React knows when to update the UI based on transactions happen.
There are many other advantages that it brings with itself, one major plus being its reconciliation algorithm.
And because browsers understand Java, React is also used for building Web User Interfaces.
But what really made this library so popular? It is three design concepts that propel React in the top.
Components: it can use, reuse and compose them
In React, UI is described by using components (functions). You give some input to the functions and they come back with an output. Functions can be used and reused as many times as needed and they can also be combined in bigger ones.
For components, it is the same. Their input is called properties and state and the output is the description of the UI (similar to what is HTML for browsers. You can reuse the same component for multiple UIs and also a component can contain components.
This library’s names comes from the explanations of what it really does: it reacts. When the component changes, the User Interface changes as well.
In a browser, the HTML views need to be regenerated, but with React, there is no worry about the changes, whether it’s about how to reflect the changes or when to take them to the browser. It reacts to the changes and it automatically does the updates.
The virtual representation of views in memory
With React, HTML is written using JS. So HTML depends on some data and it isn’t enhanced to work with data. Frameworks usually enhance HTML with data.
No matter if you use the enhanced HTML or the power of JS to generate HTML, both options have pros and cons. It uses the second approach, as it has more pros than cons.
The biggest advantage is that using Java to render HTML makes it easier for React to keep a virtual representation of HTML.