React Redux — это официальный слой привязок React UI для Redux, который в настоящее время очень популярен. Он позволяет вашим компонентам React считывать данные из хранилища Redux и отправлять действия в хранилище для обновления состояния.
И если вы знакомы с React Redux, вы столкнетесь с путаницей при выборе между connect и useSelector для получения значений из хранилища, и они могут иметь одинаковые результаты.
Меньше шаблонного кода
Чтобы было ясно, connect — это компонент высокого порядка, useSelector — это хук. Использование useSelector может сократить шаблонный код и встроить эту логику в сами компоненты.
Лучшая производительность
Как я уже сказал выше, connect — это HOC, что означает, что вы передаете свой собственный компонент, а connect возвращает компонент-обертку, который выполняет всю работу по подписке на хранилище, запуску вашего mapState и mapDispatch и передаче объединенных свойств вашему собственному компоненту. И connect заставит ваш компонент отрисовываться, если переданные свойства изменились, кроме того, все новые значения из mapState также заставят его перерисовываться, и компонент действует как PureComponent . Это означает, что connect имеет лучшую производительность по умолчанию.
С другой стороны, useSelector — это просто хук, который вы вызвали внутри ваших компонентов функций, и у вас нет возможности изменить отрисовку, когда изменились родительские свойства. Это очень важно, когда дело доходит до оптимизации, но вы можете оптимизировать компоненты функций, которые используют useSelector, с помощью useMemo, чтобы предотвратить ненужные повторные отрисовки.
Заключение
Я рекомендую использовать Selector, если вы новичок в React и React Redux. Но когда вы поймете, что именно вы оптимизируете, тогда выбирайте метод, который лучше всего подходит вашему подходу.