When choosing which technology to use in the frontend of a new project, we face a delicate and important decision that will greatly influence the future of our application, so it is important to choose technologies that complement and facilitate development. Facebook recently released ReactJS, an open source Javascript library, which has benefited them in the development of some of its platforms, for example, Instagram. This library, despite having somewhat controversial details, offers great benefits in performance, modularity and promotes a very clear flow of data and events, facilitating the planning and development of complex apps.
It is important to note that ReactJS is a library focused on visualization. If we are starting a project we can build on the Flux architecture, but if we already have a project using an MVC Framework like AngularJS we can leave AngularJS as Controller and ReactJS take care of the views. This makes sense because ReactJS has a superior performance at the moment to manipulate the DOM, and this has a great impact when dealing with long lists that constantly change in our visualization.
The secret of ReactJS to have a very high performance, is that it implements something called Virtual DOM and instead of rendering the entire DOM in each change, which is what is normally done, it makes the changes in a copy in memory and then uses an algorithm to compare the properties of the in-memory copy with those of the DOM version and thus apply changes only in the varying parts. This may sound like a lot of work, but in practice it is much more efficient than the traditional method we have a list of two thousand elements in the interface and ten changes occur, it is more efficient to apply ten changes, locate the components that had a change in their properties and render these ten elements, apply ten changes and render two thousand elements.
There are more steps to plan and program, but it offers a better user experience and a very linear planning. An important feature of ReactJS is that it promotes the flow of data in one direction, instead of the typical bidirectional flow in modern Frameworks, this makes it easier to plan and detect errors in complex applications, in which the flow of information can reach To be very complex, leading to difficult mistakes to locate that can make life very sad.
Hopefully, that will give you a bit of a head-start on React, and help you avoid some of the more common mistakes while creating your Web Applications.
Top comments (0)