One of the most important questions to be answered, when you dive or prepare to dive in new technology is Why exactly I need this?
People are usually visual, or better say that, to learn new concept they need to compare it with something old. Even though I chose automobile for this example, I actually don’t drive. Weirdly enough that doesn’t stop me to know a bit or two about how cars work. So lets start the engine…
Application
Imagine that your automobile is React application. It consist of set of components that work together in such way to provide us desired functionality.
Naturally there are parts / components in your car that can work standalone. Or at least tightly coupled with their so called child components, which work for the same purpose. Yet they still don’t directly share resources with other parts of the system.
Engine
One of the most important components of automobile sure is engine. It creates the energy which makes the car go around.
Engine / Fuel tank
In React application such is your car, Fuel tank can be child component of Engine. It serves the purpose of providing storage for the required fuel which Engine uses to generate energy.
That means that State of Fuel tank is crucial for Engine.
Now lets think about the big picture for a second.
Do any other component outside of Engine need to be directly aware of Fuel tank’s state? Short answer is simply No.
Fuel tank state must be available almost exclusively to Engine (with exception to car control panel which should communicates directly with Fuel tank).
With all of this info we can easily conclude that Fuel tank State should be stored on component level. No Flux needed there…
Battery
When we talk about battery and its importance for automobile, one term come to my mind, Shared resource.
State of the Battery component is important and relevant for more than one part of the system. It can power Lights, Radio, Air Condition… it is even crucial for firing up the Engine.
This all brings us to the whole point of this article.
Battery sure is component for itself, but its state needs to be available to many other components. In that kind of scenario, instead of forcing those components to communicate directly (which is costly and complex process), wise engineer would include the middle man.
When ever there is a need for some state to be shared among multiple components Flux libraries are natural way to go.
Outcome
When we talk about the Component Based Development on Front-End, React is one of the best solutions.
It brought revolution to the way we approach the base technology. Which all of the sudden became more performant and maintainable.
But without State management libraries such is Flux, it would never be able to achieve revolutionary status. Since core of scalability / performances is in Flux not in React…
Did you liked this article? If so tap or click on “︎❤” to help others reach it… Or maybe follow me here or on twitter.com/develoger decision is yours :)
