review-react-codebase-red-flags

Run a structured review that scans dependencies, folder structure, components, state management, TypeScript usage, hooks, and error handling. Inspect representative files behind each suspected pattern, then report findings by severity with file paths, evidence, and the smallest safe fix.

Common red flags include god components, derived values stored in state, one massive Context causing re-render storms, array index keys, any types and disabled exhaustive-deps lint rules, empty catch blocks, and missing error boundaries or loading states.

Check for libraries doing what vanilla JavaScript handles, heavy packages where lighter alternatives exist, and third-party APIs imported directly throughout app code instead of behind local adapters. Inspect actual call sites before recommending removal.

Split when a named responsibility or seam becomes clearer, not by line count alone. God components that mix data fetching, state orchestration, and rendering are prime candidates; extract presenters, predicates, or policy helpers as separate modules.

Yes. The review first maps the project's own conventions—package scripts, lint config, TypeScript config, and routing structure—then judges consistency against those conventions rather than imposing one canonical React structure.

Avoid memoizing everything. Memoize only when identity affects child renders, context provider values, expensive calculations, or hook dependency stability. Default object, array, or function values that break memoization should be fixed at the source instead.