eslint-plugin-react-perf

Performance-minded React linting rules for ESLint

MIT 28 个版本
react eslint eslintplugin eslint-plugin perf
主页
仓库
提交 Issue
安装
npm install eslint-plugin-react-perf
yarn add eslint-plugin-react-perf
pnpm add eslint-plugin-react-perf
bun add eslint-plugin-react-perf
README

eslint-plugin-react-perf

Performance-minded React linting rules for ESLint (motivated by esamatti's post "React.js pure render performance anti-pattern").

Installation

$ npm i eslint-plugin-react-perf

Add plugins section and specify eslint-plugin-react-perf as a plugin.

{
  "plugins": ["react-perf"]
}

List of supported rules

Configuration

As of v3.3.0, each eslint-plugin-react-perf rule supports configuration to control whether native elements (lower case first letter React components) are ignored.

With this configuration, all native elements are ignored for this rule:

{
  "react-perf/jsx-no-new-object-as-prop": [
    "error",
    {
      "nativeAllowList": "all"
    }
  ]
}

With this configuration, the "style" attribute is ignored for native elements for this rule:

{
  "react-perf/jsx-no-new-object-as-prop": [
    "error",
    {
      "nativeAllowList": ["style"]
    }
  ]
}

This plugin exports a recommended configuration that enforce React good practices.

Flat configuration

To enable this configuration add the following to your eslint.config.js:

import reactPerfPlugin from 'eslint-plugin-react-perf';

const config = [
  reactPerfPlugin.configs.flat.recommended
];

export default config;

eslintrc configuration

To enable this configuration use the extends property in your .eslintrc config file:

{
  "extends": ["plugin:react-perf/recommended"]
}

See ESLint documentation for more information about extending configuration files.

The rules enabled in this configuration are:

All

This plugin also exports an all configuration that includes every available rule.

Flat configuration

To enable this configuration add the following to your eslint.config.js:

import reactPerfPlugin from 'eslint-plugin-react-perf';

const config = [
  reactPerfPlugin.configs.flat.all
];

export default config;

eslintrc configuration

{
  "plugins": [
    "react-perf"
  ],
  "extends": ["plugin:react-perf/all"]
}

Test anti-patterns in runtime

Try out cvazac/test-ref-pattern.

License

eslint-plugin-react-perf is licensed under the MIT License.

版本列表
3.3.3 2024-10-18
3.3.2 2024-01-11
3.3.1 2021-12-14
3.3.0 2020-10-30
3.2.4 2020-07-23
3.2.3 2019-11-05
3.2.2 2019-11-05
3.2.1 2019-08-13
3.2.0 2019-06-08
3.1.0 2019-03-15
3.0.2 2019-02-09
3.0.1 2019-01-12
3.0.0 2019-01-12
2.0.9 2018-07-24
2.0.8 2018-01-31
2.0.7 2018-01-31
2.0.6 2017-10-24
2.0.5 2017-05-10
2.0.4 2016-12-07
2.0.3 2016-12-05
2.0.2 2016-12-02
2.0.1 2016-12-02
2.0.0 2016-12-02
1.0.4 2016-12-01
1.0.3 2016-12-01
1.0.2 2016-12-01
1.0.1 2016-12-01
1.0.0 2016-12-01