---
url: /docs/guide/usage/linter/rules/react_perf/jsx-no-new-array-as-prop.md
---

### What it does

Prevent arrays that are local to the current method from being used
as values of JSX props.

### Why is this bad?

Using locally defined arrays as values for props can lead to unintentional
re-renders and performance issues. Every time the parent component renders,
a new instance of the Array is created, causing unnecessary re-renders of
child components. This also leads to harder-to-maintain code as the
component's props are not passed consistently.

### Examples

Examples of **incorrect** code for this rule:

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

Examples of **correct** code for this rule:

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

## Configuration

This rule accepts a configuration object with the following properties:

### nativeAllowList

type: `array | "all"`

#### nativeAllowList\[n]

type: `string`

## How to use

## Version

This rule was added in v0.2.3.

## References