Well, not exactly. But the project itself isn’t doing very well and may kill your’s app performance and act in a way which you don’t expect it to. Here’s quick and concise rant after rewriting the app to get rid of redux-form. And here’s the reason why.

The background

For those of you who haven’t been really trapped into building large and sometimes multi-step forms in React – it is a complex job. You have to keep track of all the fields state, including whenever the field has been touched, empty or contains invalid value.

But does that really needs Redux? Gosha Arinich has answered this question perfectly and I strongly encourage you to read his article.

Let me quote Dan Abramov, the father of Redux here:

Use React for ephemeral state that doesn’t matter to the app globally and doesn’t mutate in complex ways. For example, a toggle in some UI element, a form input state. Use Redux for state that matters globally or is mutated in complex ways. For example, cached users, or a post draft.

Sometimes you’ll want to move from Redux state to React state (when storing something in Redux gets awkward) or the other way around (when more components need to have access to some state that used to be local).

Issues

Over 8,500 stars on Github, 200 watchers, over 250 contributors.
And lots of unresolved issues. Sometimes the old ones, sometimes even without a single response.

Documentation

You know that feeling when you use the library like it’s said in the docs and still getting weird errors? It happens to redux-form too. We’ve run into this too much often than we should.
Merging Pull Requests which contains breaking changes and no documentation updates is a serious crime.

Performance

Well, that’s a serious issue. “An image is worth a thousand words” they saying, so look at the following image. Every keystroke costs us re-rendering of the whole application. Let’s repeat: EVERY keystroke.

The colour lines on the gif above indicate re-rendering of the components. They wrap the whole app which basically means that every component updates on every keystroke.

But that’s just a simple 2 fields, example form. Imagine what will happen for a multi step wizard or registration form? Yeah, you’ve already got the answer.

Lots of code

According to the bundlephobia stats, redux-form weights 26.8kB minified and gzipped. It’s a way too much.

Alternatives

There are a few good recommendations to replace redux-form with. Even the maintainer and author of redux-form has started a new project called final-form. But I’m not buying it yet. Do you wanna use it in your project? Well, it’s your call. I’d say don’t.

Worth mentioning is the library called formik. Simple API, good docs, acceptable package size and no dependency on Redux. But it’s a topic for a separate article.

13 COMMENTS

    • That’s what I was doing on my projects, where I have had to make a decision. But now joined project where redux-form was team’s preference and eventually we needed to strip it out.

  1. The part that you mentioned about the entire form re-rendering with every keystroke is actually wrong. That’s an error in implementation than Redux-forms. The redux-form may wrap the whole component but each Field is wrapped separately which makes for granular updates.

    • It was a bug in version 6.0.* IIRC. However, avoiding this problem in subsequent versions still requires very, very careful coding. For instance, you can’t put anonymous functions in a Field.component attribute.

      Overall, my experience with redux-form has been nothing but bad.

  2. Yeah, redux-form ends up costing me time whenever I use it. I don’t have any alternatives at this time, but I would NOT recommend redux-form.

  3. Redux-form saved my life, 20 years working with forms, if you really need a very complex system help you to build forms, connected , with complex behavoiur, redux-form is a great solutions. Most of people work with trivial forms, so you can do it wiht formix or just react. But redux-form is the best things that I met in all my life of developper. same if it’s 60kb who care old browser or old computers, or old phones. Slow is when you use old and slow computers. Very complex redux form work very well in my computer and around 20 customers that i have, working in a very nice mix SPA of react 16 , apollo graphql.

  4. Yeah, not everything requires a library, especially not a heavyweight library. Just use local state the plain and simple React way, and save yourself the trouble of pointless over-engineered Redux-driven forms. Your components may need Redux but not Redux Forms. At least that’s what I remind myself of, all the time. LOL.

LEAVE A REPLY

Please enter your comment!
Please enter your name here