How we moved from using React to React-Redux
While working in a stressful working environment, complete with strict deadlines and pressure to deliver, it’s often difficult to take a break and step back to determine whether you are proceeding the right way – or the fast way. Of course, many development managers and developers are stuck in this obviously far from ideal predicament.
Here at Galil Software, we found ourselves in a similar situation. We were developing web apps using React, a seemingly cutting edge tool for developers. In reality, we were just using React with old fashioned design patterns, such as using an events mechanism, harsh state communications (very long, from parent to child), and so on.
We realized we needed a change, even in the knowledge that it could actually impact our progress. But we wanted it, and, of course, we also wanted to garner new knowledge and skills by working with new, cutting edge tools.
So we stepped back, analyzed, and quickly made the move.
That move, working in a combination of React-Redux, was, at the beginning, not that easy to understand, and not so easy to implement. But we gradually got more confident with it and soon began to comprehend its potential and power.
In short, React-Redux is a combination of React, Flux and Immutability. We believe it’s an excellent choice.
- React: Mainly a convenient view development library writing modern code (there is still a need to compile using Babel, for example).
- Flux: Application architecture (by Facebook) for managing the app state (store) and reacting to actions (events) triggered mainly by components.
- Immutability: In order to save unnecessary rendering (and enhance performance), provides an immutable store. Changing any object/value in the store mutates the tree path of changes only, which helps React to know what was changed in the whole tree.
We’ve quickly got to grips with some of the key advantages with working React-Redux, including the following:
- Significant performance improvement, especially for large, single page web apps.
- Maintainable and neater code.
- Better control and monitoring of the state, dispatching and component view changes.
- Better component decoupling and more single responsibility components.
We’re continuing to uncover more benefits of working with React-Redux, so watch out for additional posts!