4 ms·

I've got apps where I am passing props down a few levels (perhaps three components deep). What I don't completely understand if Context is a _better_ solution f

by cstrat 8y ago

I've got apps where I am passing props down a few levels (perhaps three components deep). What I don't completely understand if Context is a _better_ solution for what I am doing or if it is just another way to accomplish the same thing. Love that React is always improving!

Waterluvian 8y ago
I hear you. I usually use Redux and I find myself `connect`ing a lot more things than I used to. So far I haven't found any seriously painful reasons to do so. Like each tab of my phone app is connected. Each major "concept" in my app is connected. Generally everything above connected components are purely layout/app navigation and it seems to work. I'm betting Dan would suggest it's not necessarily a bad idea and might be fine. I suppose context is a way of doing that. But I'm just don't grok it yet. I should experiment a lot more.
- acemarke 8y ago
  Generally, connecting more components to Redux is better for performance. The cost of more `mapState` calls is less than the cost of more "wasted" renders, and when a component needs smaller pieces of the Redux state, other state changing means it's not affected. See my post "Practical Redux, Part 6: Connected Lists and Performance" [0] and the Redux FAQ entry on using React-Redux [1] for more details. Also, we're completely rewriting the React-Redux docs from scratch, and they now have their own site [2] . We've got some new tutorial material available, and a guide section on writing `mapState` functions. The new section on using `mapDispatch` should be up soon, and we've got a lot more planned, including sections on writing selectors, performance optimizations, and how React-Redux works internally. [0] https://blog.isquaredsoftware.com/2017/01/practical-redux-part-6-connected-lists-forms-and-performance/ https://blog.isquaredsoftware.com/2017/01/practical-redux-pa... [1] https://redux.js.org/faq/reactredux https://redux.js.org/faq/reactredux [2] https://react-redux.js.org https://react-redux.js.org
- __s 8y ago
  Where I'm at we were putting refs into redux, but since HTML elements are mutable they don't quite belong in redux. So moved them into an API where the refs can be passed down the tree with contexts. Then use those refs for rendering portals. Useful for having content be able to manage a panel elsewhere on screen

by cstrat 8y ago

Waterluvian 8y ago

I hear you. I usually use Redux and I find myself `connect`ing a lot more things than I used to. So far I haven't found any seriously painful reasons to do so. Like each tab of my phone app is connected. Each major "concept" in my app is connected. Generally everything above connected components are purely layout/app navigation and it seems to work. I'm betting Dan would suggest it's not necessarily a bad idea and might be fine. I suppose context is a way of doing that. But I'm just don't grok it yet. I should experiment a lot more.

acemarke 8y ago
Generally, connecting more components to Redux is better for performance. The cost of more `mapState` calls is less than the cost of more "wasted" renders, and when a component needs smaller pieces of the Redux state, other state changing means it's not affected. See my post "Practical Redux, Part 6: Connected Lists and Performance" [0] and the Redux FAQ entry on using React-Redux [1] for more details. Also, we're completely rewriting the React-Redux docs from scratch, and they now have their own site [2] . We've got some new tutorial material available, and a guide section on writing `mapState` functions. The new section on using `mapDispatch` should be up soon, and we've got a lot more planned, including sections on writing selectors, performance optimizations, and how React-Redux works internally. [0] https://blog.isquaredsoftware.com/2017/01/practical-redux-part-6-connected-lists-forms-and-performance/ https://blog.isquaredsoftware.com/2017/01/practical-redux-pa... [1] https://redux.js.org/faq/reactredux https://redux.js.org/faq/reactredux [2] https://react-redux.js.org https://react-redux.js.org
__s 8y ago
Where I'm at we were putting refs into redux, but since HTML elements are mutable they don't quite belong in redux. So moved them into an API where the refs can be passed down the tree with contexts. Then use those refs for rendering portals. Useful for having content be able to manage a panel elsewhere on screen