Don’t use Redux!
Redux is used by too many react developers without thinking twice! Applied mindlessly like that, redux does more harm than good! I will show the fields in which redux shines and — most importantly — I will point out the situations in which redux is the wrong tool in my strong opinion.
Why Redux was Invented
Don’t get me wrong: I think the idea of Flux and its canonical react implementation redux are awesome inventions! They solve a real problem pretty elegantly. It’s just that most developers don’t have that problem!
Redux (and the underlying general idea of Flux) was invented to manage and debug application state in very large software systems. Think Facebook. If your team has hundreds of developers and millions lines of code, it is often difficult to write modular tests and find bugs. Redux makes state changes explicit, localizes them in one store and has strict rules about side effects. This makes your code easier to test and it makes application state easier to reason about.
A goal of redux is also to be a convention, not a library. So redux is plain Javascript and you don’t need any dependencies to use it (although many will probably use the react-redux bindings). This makes using redux pain-free from a dependency management point of view; but it also makes you write a lot of boiler plate code.
What I Hate About Redux
If you use redux to develop your application, even small changes in functionality require you to write excessive amounts of code. This goes against the direct-mapping principle, which states that small functional changes should result in small code changes.
Just imagine, you want to add a new variable to your state just to try it out. You think this little change will satisfy your tests and in a pragmatic way, you go for it. Doing so in a non-redux application might need changes in one or two files and take you two minutes. Not so in a redux application. With redux you will have to touch many files and you will have to repeat yourself a lot:
- Define an action constant in
my-feature/constants.js - Import that constant and define an action in
my-feature/actions.js - Import the constant and define a state change in…
