← Back to rules

react-perf/jsx-no-new-array-as-prop Perf

何ができるか

現在のメソッド内にローカルに定義された配列を、JSXプロパティの値として使用しないようにします。

なぜ問題か

ローカルに定義された配列をプロパティの値として使用すると、意図しない再レンダリングやパフォーマンスの問題を引き起こす可能性があります。親コンポーネントがレンダリングされるたびに、新しい配列インスタンスが作成され、子コンポーネントが不要な再レンダリングを引き起こします。また、コンポーネントのプロパティが一貫して渡されていないため、コードの保守性も低下します。

例

このルールに違反する誤ったコードの例：

<Item list={[]} />
<Item list={new Array()} />
<Item list={Array()} />
<Item list={this.props.list || []} />
<Item list={this.props.list ? this.props.list : []} />

このルールに従う正しいコードの例：

<Item list={this.props.list} />

使用方法

設定ファイルまたはCLIを使用してこのルールを有効化するには、以下の通りです：

Config (.oxlintrc.json)

{
  "plugins": ["react-perf"],
  "rules": {
    "react-perf/jsx-no-new-array-as-prop": "error"
  }
}

CLI

oxlint --deny react-perf/jsx-no-new-array-as-prop --react-perf-plugin

参照

• ルールのソース