Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

[Refactor] improve performance by avoiding unnecessary component detect #3273

Merged
merged 1 commit into from Apr 19, 2022
Merged

[Refactor] improve performance by avoiding unnecessary component detect #3273

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Jump to
Jump to file
Failed to load files.
Diff view
Diff view
2 changes: 2 additions & 0 deletions CHANGELOG.md
View file
Open in desktop
Expand Up @@ -24,7 +24,9 @@ This change log adheres to standards from [Keep a CHANGELOG](https://keepachange
* [Refactor] improve performance for detecting class components ([#3267][] @golopot)
* [Refactor] [`no-deprecated`]: improve performance ([#3271][] @golopot)
* [Refactor] [`no-did-mount-set-state`], [`no-did-update-set-state`], [`no-will-update-set-state`]: improve performance ([#3272][] @golopot)
* [Refactor] improve performance by avoiding unnecessary `Components.detect` ([#3273][] @golopot)

[#3273]: https://github.com/jsx-eslint/eslint-plugin-react/pull/3273
[#3272]: https://github.com/jsx-eslint/eslint-plugin-react/pull/3272
[#3271]: https://github.com/jsx-eslint/eslint-plugin-react/pull/3271
[#3267]: https://github.com/jsx-eslint/eslint-plugin-react/pull/3267
Expand Down
5 changes: 3 additions & 2 deletions lib/rules/display-name.js
View file
Open in desktop
Expand Up @@ -9,6 +9,7 @@ const values = require('object.values');

const Components = require('../util/Components');
const astUtil = require('../util/ast');
const componentUtil = require('../util/componentUtil');
const docsUrl = require('../util/docsUrl');
const propsUtil = require('../util/props');
const report = require('../util/report');
Expand Down Expand Up @@ -106,7 +107,7 @@ module.exports = {
astUtil.isFunctionLikeExpression(node)
&& node.parent
&& (node.parent.type === 'VariableDeclarator' || node.parent.type === 'Property' || node.parent.method === true)
&& (!node.parent.parent || !utils.isES5Component(node.parent.parent))
&& (!node.parent.parent || !componentUtil.isES5Component(node.parent.parent, context))
);

if (
Expand Down Expand Up @@ -192,7 +193,7 @@ module.exports = {
},

ObjectExpression(node) {
if (!utils.isES5Component(node)) {
if (!componentUtil.isES5Component(node, context)) {
return;
}
if (ignoreTranspilerName || !hasTranspilerName(node)) {
Expand Down
3 changes: 1 addition & 2 deletions lib/rules/jsx-indent.js
View file
Open in desktop
Expand Up @@ -36,7 +36,6 @@ const astUtil = require('../util/ast');
const docsUrl = require('../util/docsUrl');
const reportC = require('../util/report');
const jsxUtil = require('../util/jsx');
const isCreateElement = require('../util/isCreateElement');

// ------------------------------------------------------------------------------
// Rule Definition
Expand Down Expand Up @@ -428,7 +427,7 @@ module.exports = {
}
if (
!fn
|| !jsxUtil.isReturningJSX((n) => isCreateElement(n, context), node, context, true)
|| !jsxUtil.isReturningJSX(node, context, true)
) {
return;
}
Expand Down
5 changes: 2 additions & 3 deletions lib/rules/jsx-no-bind.js
View file
Open in desktop
Expand Up @@ -8,7 +8,6 @@
'use strict';

const propName = require('jsx-ast-utils/propName');
const Components = require('../util/Components');
const docsUrl = require('../util/docsUrl');
const jsxUtil = require('../util/jsx');
const report = require('../util/report');
Expand Down Expand Up @@ -63,7 +62,7 @@ module.exports = {
}],
},

create: Components.detect((context) => {
create(context) {
ljharb marked this conversation as resolved.
Show resolved Hide resolved
const configuration = context.options[0] || {};

// Keep track of all the variable names pointing to a bind call,
Expand Down Expand Up @@ -198,5 +197,5 @@ module.exports = {
}
},
};
}),
},
};
8 changes: 4 additions & 4 deletions lib/rules/no-access-state-in-setstate.js
View file
Open in desktop
Expand Up @@ -6,7 +6,7 @@
'use strict';

const docsUrl = require('../util/docsUrl');
const Components = require('../util/Components');
const componentUtil = require('../util/componentUtil');
const report = require('../util/report');

// ------------------------------------------------------------------------------
Expand All @@ -29,7 +29,7 @@ module.exports = {
messages,
},

create: Components.detect((context, components, utils) => {
create(context) {
function isSetStateCall(node) {
return node.type === 'CallExpression'
&& node.callee.property
Expand All @@ -48,7 +48,7 @@ module.exports = {
}

function isClassComponent() {
return !!(utils.getParentES6Component() || utils.getParentES5Component());
return !!(componentUtil.getParentES6Component(context) || componentUtil.getParentES5Component(context));
}

// The methods array contains all methods or functions that are using this.state
Expand Down Expand Up @@ -183,5 +183,5 @@ module.exports = {
});
},
};
}),
},
};
5 changes: 3 additions & 2 deletions lib/rules/no-arrow-function-lifecycle.js
View file
Open in desktop
Expand Up @@ -9,6 +9,7 @@ const values = require('object.values');

const Components = require('../util/Components');
const astUtil = require('../util/ast');
const componentUtil = require('../util/componentUtil');
const docsUrl = require('../util/docsUrl');
const lifecycleMethods = require('../util/lifecycleMethods');
const report = require('../util/report');
Expand Down Expand Up @@ -44,7 +45,7 @@ module.exports = {
fixable: 'code',
},

create: Components.detect((context, components, utils) => {
create: Components.detect((context, components) => {
/**
* @param {Array} properties list of component properties
*/
Expand All @@ -57,7 +58,7 @@ module.exports = {
const propertyName = astUtil.getPropertyName(node);
const nodeType = node.value.type;
const isLifecycleMethod = (
node.static && !utils.isES5Component(node)
node.static && !componentUtil.isES5Component(node, context)
? lifecycleMethods.static
: lifecycleMethods.instance
).indexOf(propertyName) > -1;
Expand Down
12 changes: 7 additions & 5 deletions lib/rules/no-deprecated.js
View file
Open in desktop
Expand Up @@ -8,9 +8,8 @@
'use strict';

const values = require('object.values');

const Components = require('../util/Components');
const astUtil = require('../util/ast');
const componentUtil = require('../util/componentUtil');
const docsUrl = require('../util/docsUrl');
const pragmaUtil = require('../util/pragma');
const testReactVersion = require('../util/version').testReactVersion;
Expand Down Expand Up @@ -104,7 +103,7 @@ module.exports = {
schema: [],
},

create: Components.detect((context, components, utils) => {
create(context) {
const pragma = pragmaUtil.getFromContext(context);
const deprecated = getDeprecated(pragma);

Expand Down Expand Up @@ -167,7 +166,10 @@ module.exports = {
* @param {ASTNode} node The AST node being checked.
*/
function checkLifeCycleMethods(node) {
if (utils.isES5Component(node) || utils.isES6Component(node)) {
if (
componentUtil.isES5Component(node, context)
|| componentUtil.isES6Component(node, context)
) {
const methods = getLifeCycleMethods(node);
methods.forEach((method) => checkDeprecation(node, method.name, method.node));
}
Expand Down Expand Up @@ -221,5 +223,5 @@ module.exports = {
ClassExpression: checkLifeCycleMethods,
ObjectExpression: checkLifeCycleMethods,
};
}),
},
};
5 changes: 3 additions & 2 deletions lib/rules/no-direct-mutation-state.js
View file
Open in desktop
Expand Up @@ -7,6 +7,7 @@
'use strict';

const Components = require('../util/Components');
const componentUtil = require('../util/componentUtil');
const docsUrl = require('../util/docsUrl');
const report = require('../util/report');

Expand Down Expand Up @@ -99,7 +100,7 @@ module.exports = {
return;
}
const item = getOuterMemberExpression(node.left);
if (utils.isStateMemberExpression(item)) {
if (componentUtil.isStateMemberExpression(item)) {
const mutations = (component && component.mutations) || [];
mutations.push(node.left.object);
components.set(node, {
Expand All @@ -115,7 +116,7 @@ module.exports = {
return;
}
const item = getOuterMemberExpression(node.argument);
if (utils.isStateMemberExpression(item)) {
if (componentUtil.isStateMemberExpression(item)) {
const mutations = (component && component.mutations) || [];
mutations.push(item);
components.set(node, {
Expand Down
8 changes: 4 additions & 4 deletions lib/rules/no-redundant-should-component-update.js
View file
Open in desktop
Expand Up @@ -4,8 +4,8 @@

'use strict';

const Components = require('../util/Components');
const astUtil = require('../util/ast');
const componentUtil = require('../util/componentUtil');
const docsUrl = require('../util/docsUrl');
const report = require('../util/report');

Expand All @@ -31,7 +31,7 @@ module.exports = {
schema: [],
},

create: Components.detect((context, components, utils) => {
create(context) {
/**
* Checks for shouldComponentUpdate property
* @param {ASTNode} node The AST node being checked.
Expand Down Expand Up @@ -65,7 +65,7 @@ module.exports = {
* @param {ASTNode} node The AST node being checked.
*/
function checkForViolation(node) {
if (utils.isPureComponent(node)) {
if (componentUtil.isPureComponent(node, context)) {
const hasScu = hasShouldComponentUpdate(node);
if (hasScu) {
const className = getNodeName(node);
Expand All @@ -83,5 +83,5 @@ module.exports = {
ClassDeclaration: checkForViolation,
ClassExpression: checkForViolation,
};
}),
},
};
8 changes: 4 additions & 4 deletions lib/rules/no-string-refs.js
View file
Open in desktop
Expand Up @@ -5,7 +5,7 @@

'use strict';

const Components = require('../util/Components');
const componentUtil = require('../util/componentUtil');
const docsUrl = require('../util/docsUrl');
const report = require('../util/report');

Expand Down Expand Up @@ -40,7 +40,7 @@ module.exports = {
}],
},

create: Components.detect((context, components, utils) => {
create(context) {
const detectTemplateLiterals = context.options[0] ? context.options[0].noTemplateLiterals : false;
/**
* Checks if we are using refs
Expand All @@ -49,7 +49,7 @@ module.exports = {
*/
function isRefsUsage(node) {
return !!(
(utils.getParentES6Component() || utils.getParentES5Component())
(componentUtil.getParentES6Component(context) || componentUtil.getParentES5Component(context))
&& node.object.type === 'ThisExpression'
&& node.property.name === 'refs'
);
Expand Down Expand Up @@ -115,5 +115,5 @@ module.exports = {
}
},
};
}),
},
};
9 changes: 5 additions & 4 deletions lib/rules/no-typos.js
View file
Open in desktop
Expand Up @@ -7,6 +7,7 @@
const PROP_TYPES = Object.keys(require('prop-types'));
const Components = require('../util/Components');
const docsUrl = require('../util/docsUrl');
const componentUtil = require('../util/componentUtil');
const report = require('../util/report');
const lifecycleMethods = require('../util/lifecycleMethods');

Expand Down Expand Up @@ -202,7 +203,7 @@ module.exports = {
},

'ClassProperty, PropertyDefinition'(node) {
if (!node.static || !utils.isES6Component(node.parent.parent)) {
if (!node.static || !componentUtil.isES6Component(node.parent.parent, context)) {
return;
}

Expand All @@ -223,7 +224,7 @@ module.exports = {

if (
relatedComponent
&& (utils.isES6Component(relatedComponent.node) || (
&& (componentUtil.isES6Component(relatedComponent.node, context) || (
relatedComponent.node.type !== 'ClassDeclaration' && utils.isReturningJSX(relatedComponent.node)))
&& (node.parent && node.parent.type === 'AssignmentExpression' && node.parent.right)
) {
Expand All @@ -232,15 +233,15 @@ module.exports = {
},

MethodDefinition(node) {
if (!utils.isES6Component(node.parent.parent)) {
if (!componentUtil.isES6Component(node.parent.parent, context)) {
return;
}

reportErrorIfLifecycleMethodCasingTypo(node);
},

ObjectExpression(node) {
const component = utils.isES5Component(node) && components.get(node);
const component = componentUtil.isES5Component(node, context) && components.get(node);

if (!component) {
return;
Expand Down
8 changes: 4 additions & 4 deletions lib/rules/no-unsafe.js
View file
Open in desktop
Expand Up @@ -5,8 +5,8 @@

'use strict';

const Components = require('../util/Components');
const astUtil = require('../util/ast');
const componentUtil = require('../util/componentUtil');
const docsUrl = require('../util/docsUrl');
const testReactVersion = require('../util/version').testReactVersion;
const report = require('../util/report');
Expand Down Expand Up @@ -44,7 +44,7 @@ module.exports = {
],
},

create: Components.detect((context, components, utils) => {
create(context) {
const config = context.options[0] || {};
const checkAliases = config.checkAliases || false;

Expand Down Expand Up @@ -133,7 +133,7 @@ module.exports = {
* @param {ASTNode} node The AST node being checked.
*/
function checkLifeCycleMethods(node) {
if (utils.isES5Component(node) || utils.isES6Component(node)) {
if (componentUtil.isES5Component(node, context) || componentUtil.isES6Component(node, context)) {
const methods = getLifeCycleMethods(node);
methods.forEach((method) => checkUnsafe(node, method));
}
Expand All @@ -144,5 +144,5 @@ module.exports = {
ClassExpression: checkLifeCycleMethods,
ObjectExpression: checkLifeCycleMethods,
};
}),
},
};
8 changes: 4 additions & 4 deletions lib/rules/no-unused-class-component-methods.js
View file
Open in desktop
Expand Up @@ -5,8 +5,8 @@

'use strict';

const Components = require('../util/Components');
const docsUrl = require('../util/docsUrl');
const componentUtil = require('../util/componentUtil');
const report = require('../util/report');

// ------------------------------------------------------------------------------
Expand Down Expand Up @@ -115,7 +115,7 @@ module.exports = {
],
},

create: Components.detect((context, components, utils) => {
create: ((context) => {
let classInfo = null;

// Takes an ObjectExpression node and adds all named Property nodes to the
Expand Down Expand Up @@ -171,13 +171,13 @@ module.exports = {

return {
ClassDeclaration(node) {
if (utils.isES6Component(node)) {
if (componentUtil.isES6Component(node, context)) {
classInfo = getInitialClassInfo(node, true);
}
},

ObjectExpression(node) {
if (utils.isES5Component(node)) {
if (componentUtil.isES5Component(node, context)) {
classInfo = getInitialClassInfo(node, false);
}
},
Expand Down