Forget Angular & Ember, React Has Already Won the Client-Side War
This article was peer reviewed by Nilson Jacques, Chris Perry and Thomas Greco. Thanks to all of SitePoint’s peer reviewers for making SitePoint content the best it can be!
You can find examples of how these types of applications are built at TodoMVC, as the name suggests they have traditionally been made up of Models, Views and Controllers.
React enters from left of stage
No information was given on how you should structure your application other than that of a component hierarchy — composable chunks of UI that could re-render efficiently whenever state changed. React took a few notable stances against popular ideas that existed in this space, features like two-way data binding and templating were blasted as bad ideas that are best avoided.
You Had One Job React, One Job.
React Components Are Simple
Components are responsible for small isolated chunks of UI, they accept data and render consistently, every time. Front-end developers, back-end developers and designers can easily understand and contribute to components because they look like HTML and the minimal API footprint means that you can learn what you need to know about components in a day and start contributing right away.
Server Rendered HTML
React makes server-side rendering trivial because components can be thought of as functions that take data and return HTML. This design makes it easy to integrate server-side rendering into any server-side programming language or framework.
DOM Updates Are Messy
React components don’t define the transition between states. Instead, they explicitly render the view based on their current state, completely eliminating this task of manually tweaking the DOM. Its one-way data flow prevents the DOM from being the source of truth.
Admittedly, this makes certain tasks such as animation more difficult because those are cases where you do want to define transitions between states. For the vast majority of cases though, it’s much simpler to only concern yourself with the final state of how the component should be rendered.
React will continue to grow in popularity and we’ll see more supporting tools and projects. As the ecosystem around React matures, the library may change but the core ideas of one-way data flow, component hierarchies, explicit renders and virtual DOM reconciliation will live on.
React Native has shown how a simple view layer can be re-purposed to construct other types of UI as well. There’s been a shift in the industry towards this pattern of building UI’s and it’s not going away any time soon.
In short, React has won and the future is bright.
Do you agree that the principles of React will live on, or will we find a better idea next month?
Have you started using React? What are your thoughts so far?
Be sure to let me know in the comments below.