Redux: Производительность списка подключенных компонентов

Необязательно передавать все реквизиты один за другим. Вы можете использовать оператор распространения, чтобы передать все реквизиты сразу:

<List myProp = {myProp} {...rest} />

Это отправит одну опору myProp, а все остальные реквизиты существуют в реквизитах rest.

Или вы можете передать все реквизиты:

<List {...props} />

В компоненте ListItem:

const { myOtherProp1, myOtherProp2 } = props
<ListItem myOtherProp1 = {myOtherProp1} myOtherProp2 = {myOtherProp2} />

Кроме того, вы можете передать свойства по умолчанию, которые, по вашему мнению, необходимы для компонента:

List.defaultProps = {
  myOtherProp3: 'My default prop 3'
  myOtherProp10: 'My default prop 10'
}

Таким образом, вы передаете все реквизиты, но используете их, когда вам нужно их использовать.

Чтобы ответить на ваш точный вопрос:

Нет. Производительности не будет. Нет предела реквизиту. Вы можете пройти сколько угодно. Компонент-получатель получит все реквизиты из единого источника props.

Чтобы расширить ответ @Bhojendra Rauniyar на ваш точный вопрос: передача props не замедляет React, потому что он не копирует информацию, а просто создает указатель на нее, что действительно дешево. В целом Javascript работает так, например:

a = {foo:'bar'}
b = a
b.foo = "another bar"
console.info(a.foo)
    > "another bar"

Javascript переработал ссылку на a.foo, а не скопировал ее на b.foo. Таким образом, замена b.foo также изменила a.foo.

Как правило, подключение большего количества компонентов лучше для производительности, потому что стоимость запуска большего количества функций mapState меньше, чем затраты на выполнение большего количества «потраченных впустую» повторных рендеров компонентов.

Пожалуйста, ознакомьтесь с записями часто задаваемых вопросов Redux на представление и соединение нескольких компонентов, а также в моем сообщении в блоге Практический Redux, Часть 6: Подключенные списки и производительность для получения более подробной информации.