Will It Vibe?.bind(this) in a JSX event prop
Part of Code Quality & Syntax, which counts for 20% of the overall score. When this check fires it deducts 4 points from that category, once per scan, no matter how many places it turns up.
What it detects
Binding a handler in the JSX prop (onClick={this.fn.bind(this)}) creates a new function on every render, so the child prop always changes and memoized children re-render needlessly. Bind once in the constructor or use a class field arrow.
Why it matters
Writing onClick={this.handleClick.bind(this)} in JSX creates a new bound function on every render. That new reference is a different prop value each time, so a memoized child (React.memo or PureComponent) re-renders even when nothing else changed, quietly eroding the benefit of the memoization.
How to fix it
Bind the handler once in the constructor (this.handleClick = this.handleClick.bind(this)) or define it as a class field arrow (handleClick = () => {...}), then pass the reference directly as onClick={this.handleClick}. In function components, define the handler with useCallback if it is passed to memoized children.
The paid report includes a ready-to-paste prompt for your AI coding agent for every check it finds, pointed at the exact findings from your scan. See pricing
Does your repo trip this check?
Paste a GitHub URL or drop a project folder. Scans run in your browser and take seconds.
Scan your repo