What do different state management libraries have in common?
One of the freedoms React offers you is that it does not impose any standards or practices for your development. While this is great, it also leads to different practices and implementations.
To make this easier and give developers some structure, state management libraries were created:
- Redux promotes an approach focused on stores, reducers, and selectors. This leads to needing to learn specific concepts and filling your project with a bunch of boilerplate code that might impact the code’s readability and increase code complexity.
- Zustand promotes a custom hook approach where each hook holds your state. This is by far the simplest solution and currently my favorite one. It synergizes with React and fully embraces hooks.
- MobX doesn’t impose an architecture but focuses on a functional reactive approach. This leads to more specific concepts, and the diversity of practices can lead the developer to run into the same struggles of code structure that they might already suffer from with React.
One common thing in all these libraries is that all of them are trying to solve the same type of issues that we tried to solve with React Context: a way to manage our shared state.
The state that is accessible to multiple components inside a React tree is often called global state. Now, global state is often misunderstood, which leads to the addition of unnecessary complexity to your code and often needing to resort to the libraries mentioned in this section.
At the end of the day, each developer and team have their preferences and choices. Considering React gives you the freedom to handle your state however you want, you must consider all the advantages and disadvantages of each solution before making your choice. Migrating from one to another can take a lot of time and completely change the paradigm of how state is handled in your application, so choose wisely and take your time.
While global state is not the reason why React Query was built, it has an impact on its creation. The way global state is often composed led to the need to manage a specific part of it that has many challenges. This specific part is called server state and the way it was historically handled paved the way to motivate Tanner Linsley to create React Query.
