C
ChaoBro

react-doctor: Aiden Bai team builds an AI React code quality checker, 7.9k stars behind a real pain point

react-doctor: Aiden Bai team builds an AI React code quality checker, 7.9k stars behind a real pain point

After a year of vibe coding, someone finally stepped up to clean up the mess.

Aiden Bai—the guy behind million.js—and his team released react-doctor. The tagline is blunt: "Your agent writes bad React. This catches it."

Not polite, but accurate.

Why this exists

Anyone who's written React with Claude Code, Cursor, or Codex has had this experience: AI generates a dozen components at once, they seem to work, but look closer—

useEffect nesting useState, half the dependency array missing; props drilling four levels deep without memo; Tailwind classes mixing text-sm and text-xs; event handlers recreated on every render, causing child components to re-render thirty times for no reason.

AI writes code fast, but it doesn't know React's performance traps. It doesn't know when React.memo actually helps and when it's wishful thinking. It doesn't know that useCallback can sometimes add overhead instead of reducing it.

react-doctor does exactly this: it's a code health check specifically for AI-generated React.

What it detects

From the codebase and recent updates over the past two days, react-doctor's detection rules cover several key dimensions:

Performance: unnecessary re-renders, missing memo optimizations, inline functions causing child component re-renders, incomplete useEffect dependency arrays. These are AI's most common mistakes—it writes functionally correct code but has zero performance awareness.

Structure: props drilling that's too deep, using prop passing where context should be used, unreasonable component splits. AI tends to pile things together because it lacks the intuition that "this component will grow later."

Tailwind-specific: a Tailwind version check updated in the last two days, identifying whether size-N and other Tailwind v4-specific syntax matches the project version. AI gets this wrong often because its training data mixes Tailwind versions.

How it works in practice

The project runs as a GitHub Action, integrated into CI. You see react-doctor results directly on PRs without installing anything locally.

For individual developers, the value is clear: vibe coding output can run through doctor before merging. It's like adding a quality gate for AI code.

For teams, it solves a real governance problem—everyone's using AI to write code, but quality varies wildly. Having a unified detection standard is far more efficient than manually pointing out issues one by one in code review.

How it differs from ESLint

You might ask: doesn't ESLint + react-hooks plugin already do this?

There's overlap, but the positioning is different. ESLint is a general-purpose rule engine—broad coverage but limited depth. react-doctor focuses on typical defect patterns in AI-generated code—issues that ESLint rules don't cover but appear frequently in AI coding.

For example, AI loves writing useEffect(() => { fetchData(); }, []) and forgetting to handle loading and error states. ESLint won't flag this—it's syntactically valid. But react-doctor knows this is a danger signal in AI-generated code.

Is it worth using

The 7.9k star number itself proves the demand exists. Aiden Bai's team's track record is reassuring—million.js has real technical depth in React performance optimization.

The project is still early (276 commits, 9 tags), and the detection rule library is expanding rapidly. If your team is already heavily using AI for React, it's worth integrating now. Rules will only grow, and the earlier you integrate, the more valuable your accumulated detection data becomes.

But don't expect it to replace code review. It's a quality check tool, not quality assurance. Architectural issues in AI code and business logic gaps still require human judgment.

What to watch

react-doctor's leaderboard feature just went live, and there's already a real-time ranking on the README. If this community-driven approach takes off, the quality and coverage of detection rules will have a positive feedback loop.

The next thing to watch: will it expand to Vue, Svelte, and other frameworks? If the React path works, a framework-agnostic AI code quality tool would be a much larger market.

Main sources: