React Scan is an open-source performance tool that automatically finds and highlights problematic re-renders in React applications. Because React compares props by reference rather than by value, components frequently re-render when they don't need to — a problem that trips up even large production apps. React Scan surfaces these wasted and slow renders through a visual overlay, so the components worth optimizing become obvious without profiling by hand.
A defining trait is that it requires no code changes. You can drop it in via a script tag, install it as an npm dev dependency, run it against a running app through the CLI (`npx react-scan@latest init`, which auto-detects the framework), or add the browser extension to inspect any React site. The maintainers publish dedicated setup guides for React, Next.js (both App Router and Pages Router), Vite, and Remix, plus an official `vite-plugin-react-scan` for Vite projects.
Beyond the always-available toolbar overlay, React Scan exposes a programmatic layer for teams that want deeper integration: an `onRender()` API to monitor specific components, optional console logging, adjustable highlight animation speeds, and lifecycle hooks (`onCommitStart`, `onRender`, `onCommitFinish`). React Native support is available as an early preview through the `react-scan/native` entry point, covering both Expo and bare React Native, though it does not yet reach full parity with the web experience.
React Scan is built by Aiden Bai and Million Software, Inc. and released under the MIT license. It complements, rather than replaces, React DevTools: DevTools helps you inspect component trees and profile flame graphs, while React Scan is purpose-built to spotlight the specific renders hurting performance. It is a developer performance and diagnostics tool that fits alongside the site's other developer-tooling entries.
