javascript - 使用扩展运算符将所有道具传递给反应组件是否有性能成本

Question

目前我发现自己编写了很多组件，如下所示：

export default class MyComponent extends Component {
  constructor(props) {
    super(props)
    this.state = {
      someState1: 'something',
      someState2: 'something',
      someState3: 'something'
    }
  }
  render() {
    return (
      <ComponentOne prop1={this.someState1} {...this.props}/>
      <ComponentTwo prop2={this.someState2} {...this.props}/>
      <ComponentThree prop3={this.someState3} {...this.props}/>
    )
  }
}

更高级别的状态像往常一样通过道具传递并传播到子组件中。

在某些情况下，我发现我将所有道具分散到每个子组件中，因为它比指定道具更快/更容易。

所以问题是：

1. 将所有道具分散到每个组件中是否会产生性能成本，即使可能有 10 个子组件？
2. 我应该更具体地说明传递给每个组件的道具吗？
3. 对每个子组件执行此操作有什么缺点吗？

标签： javascriptreactjsreact-nativecomponents