Why redux suggests to only connect to top level components?

Question

I\'m new to redux and react-redux, in the mean time I am trying to make a redux app.

I don\'t understand the statement on redux document:

Then

Answer 1

Reading the latest answers as of when I post my answer here, I'd like to further add to the consensus of having each component connected using the official Redux style guide:

Prefer having more UI components subscribed to the Redux store and reading data at a more granular level. This typically leads to better UI performance, as fewer components will need to render when a given piece of state changes.

For example, rather than just connecting a component and reading the entire array of users, have retrieve a list of all user IDs, render list items as , and have be connected and extract its own user entry from the store.

This applies for both the React-Redux connect() API and the useSelector() hook.