You signed in with another tab or window.Reload to refresh your session.You signed out in another tab or window.Reload to refresh your session.You switched accounts on another tab or window.Reload to refresh your session.Dismiss alert
Copy file name to clipboardExpand all lines: README.md
+1-1Lines changed: 1 addition & 1 deletion
Display the source diff
Display the rich diff
Original file line number
Diff line number
Diff line change
@@ -372,7 +372,7 @@ Since each component has access to state, its `mapStateToProps` function is call
372
372
373
373
React and redux have come a long way in the last few years. One of the best improvements in React is the adding of hooks, [which lowers the amount of cognitive load when writing react components with redux](https://redux.js.org/style-guide/style-guide#use-the-react-redux-hooks-api). This adds clarity to any component, as the only props to reason about are the ones actually passed into the component, not a mix of what is coming from a parent component and redux.
374
374
375
-
In the case of `<Car>`, the complexity is actually two fold, as the `carId` prop is never even used in the render method. **By using react-redux hooks, the code becomes cleaner and more concise.**
375
+
In the case of `<Car>`, the complexity is actually two fold, as the `carId` prop is never even used in the render method. **By using react-redux hooks, the code becomes cleaner and more concise.** This adds clarity to the component, as the props are actually what was passed into the component, not a mix of what is coming from a parent prop and redux.
376
376
377
377
The most important thing to remember when converting a component from `connect` to redux hooks, is that `connect` provides built in memoization of props passed to the component, just like how `PureComponent` and `React.memo` work. So if a component has legitimate need for outside props to render something, such as an `id`, you should consider using `React.memo`. In this example, converting the component without `React.memo` causes all the `<Car>` components to start re-rendering needlessly again.