3 ms·
First off, I just want to say that my criticisms are in no way meant to demean the quality of work of the Redux contributors. Redux is the best solution for sin
by scriptkiddy 9y ago
First off, I just want to say that my criticisms are in no way meant to demean the quality of work of the Redux contributors. Redux is the best solution for single state management in the React ecosystem and it is a very well made library. Thanks for all of your effort.
My criticisms are just me simply voicing my frustration with, what seems to me, to be the generally accepted "best practice" for composing Redux applications.
Let me give you some short background: I've being doing backend work for years. Last year I signed on with a new project where I was in charge of both front and back-end work. Because of this, I was introduced to the modern front-end ecosystem and all of its intricacies. We've come a long way from jQuery. After evaluating many different front end libraries against project requirements it came down to using either Vue or React. We chose React because of its wider adoption. Eventually we hired on 2 front-end developers so I could focus on the server side of things. Well, here comes the project deadline and I'm having to pick up slack on the front-end. Now, since the new front-end devs re-wrote the entire front-end, I am struggling to understand why they structured it the way they did. They insist that having huge containers passing state down through multiple dumb components is the best way to structure the application. I feel like it introduces unnecessary complexity. Because our front-end devs have more experience in front-end development(obviously), I need to trust their judgment. I hope that helps you understand my frustrations.
>You _can_ even directly import the store into your component files and reference it directly, although that's discouraged for several reasons (per the Redux FAQ at http://redux.js.org/docs/faq/StoreSetup.html#store-setup-mul.. http://redux.js.org/docs/faq/StoreSetup.html#store-setup-mul.... ).
Yes, I definitely want to steer clear of this pattern.
>Third, you shouldn't need to "propagate an event through 5 different callbacks". One of the main points of Redux is that you can `connect()` _any_ component to give it access to the store. If a deeply nested component needs to extract a couple values from the store, or dispatch an action, go ahead and connect it - you don't have limit yourself to only a couple connected components higher up in the tree (per http://redux.js.org/docs/faq/ReactRedux.html#react-multiple-.. http://redux.js.org/docs/faq/ReactRedux.html#react-multiple-.... ).
I should show this to my team. Maybe a Redux maintainer will do a better job convincing them than I will.
>I keep a big list of links to high-quality tutorials and articles on React, Redux, and related topics, at https://github.com/markerikson/react-redux-links https://github.com/markerikson/react-redux-links . Specifically intended to be a great starting point for anyone trying to learn the ecosystem, as well as a solid source of good info on more advanced topics.
Thank you for this.
- acemarke 9y agoOh dear. Yeah, per that FAQ, the earliest advice from Dan was to just connect once or twice at the top of your app, but that early advice has been totally superseded by now. You should _absolutely_ go ahead and connect _any_ component where you feel that doing so helps simplify things, especially in terms of props passing. I discussed some of the major aspects of Redux-related performance in my blog post "Practical Redux, Part 6: Connected Lists, Forms, and Performance" [0]. That includes info on why more connected components is generally better for perf, as well as usually making it easier to understand a given component's data needs. You may also want to read through some of the articles in the "Redux Architecture" [1] and "React/Redux Performance" [2] sections of my list, particularly the post "High Performance Redux" [3]. Hopefully that info helps. Please let me know if you've got any further questions or concerns I can help with! [0] http://blog.isquaredsoftware.com/2017/01/practical-redux-part-6-connected-lists-forms-and-performance/ http://blog.isquaredsoftware.com/2017/01/practical-redux-par... [1] https://github.com/markerikson/react-redux-links/blob/master/redux-architecture.md https://github.com/markerikson/react-redux-links/blob/master... [2] https://github.com/markerikson/react-redux-links/blob/master/react-performance.md https://github.com/markerikson/react-redux-links/blob/master... [3] http://somebody32.github.io/high-performance-redux/ http://somebody32.github.io/high-performance-redux/
- scriptkiddy 9y agoYou've been extremely helpful!