Plugin: react-featuresRules
no-redundant-should-component-update
no-redundant-should-component-update rule
Prevent redundant shouldComponentUpdate implementations that just return true. This rule is part of eslint-plugin-react-features.
Quick Summary
| Aspect | Details |
|---|---|
| Severity | Warning (dead code) |
| Auto-Fix | ❌ No (requires review/removal) |
| Category | React |
| ESLint MCP | ✅ Optimized for ESLint MCP integration |
| Best For | React class components |
Rule Details
A shouldComponentUpdate method that always returns true is redundant since that's React's default behavior. Remove it or implement meaningful comparison logic.
Why This Matters
| Issue | Impact | Solution |
|---|---|---|
| 🔄 Dead code | Unnecessary method overhead | Remove or implement logic |
| 🐛 False optimization | Misleading code intent | Use PureComponent instead |
| 🔍 Maintenance burden | Code appears to do something | Clean up redundant code |
Examples
❌ Incorrect
class MyComponent extends React.Component {
// BAD: Just returns true - this is default behavior!
shouldComponentUpdate() {
return true;
}
render() {
return <div>{this.props.value}</div>;
}
}
class AnotherComponent extends React.Component {
// BAD: Also redundant
shouldComponentUpdate(nextProps, nextState) {
return true;
}
}✅ Correct
// GOOD: No shouldComponentUpdate (uses default behavior)
class MyComponent extends React.Component {
render() {
return <div>{this.props.value}</div>;
}
}
// GOOD: Meaningful implementation
class OptimizedComponent extends React.Component {
shouldComponentUpdate(nextProps, nextState) {
// Only re-render if value actually changed
return nextProps.value !== this.props.value ||
nextState.count !== this.state.count;
}
}
// BETTER: Use PureComponent for shallow comparison
class PureComponent extends React.PureComponent {
render() {
return <div>{this.props.value}</div>;
}
}
// BEST: Use functional component with React.memo
const MemoizedComponent = React.memo(function MyComponent({ value }) {
return <div>{value}</div>;
});Configuration Examples
Basic Usage
{
rules: {
'react-features/no-redundant-should-component-update': 'warn'
}
}Related Rules
require-optimization- Optimization suggestionsreact-render-optimization- Render performance
Further Reading
- shouldComponentUpdate - React docs
- PureComponent - Automatic shallow comparison
Known False Negatives
- Other always-true bodies:
return !0,return 1 === 1, or several statements that all end inreturn trueare not recognised; only a body that is exactlyreturn true;or an arrow() => true.
Not reported by design: a shouldComponentUpdate on a class that is not a React component.
Use this rule
npm install -D oxlint-plugin-react-features{ "jsPlugins": ["oxlint-plugin-react-features"], "rules": { "react-features/no-redundant-should-component-update": "error" }}import { defineConfig } from 'vite-plus';export default defineConfig({ lint: { jsPlugins: ['oxlint-plugin-react-features'], rules: { 'react-features/no-redundant-should-component-update': 'error', }, },});oxlint-plugin-react-features re-exports eslint-plugin-react-features/oxlint: the same rules under the same IDs, and no ESLint install. Why oxlint.
Did this rule catch something? Star the repo to get new CWE coverage as we ship it — or follow the AI-code-security benchmarks behind these rules.