React Scan vs TSDX
Which should you use? A side-by-side look at what each one does, who it suits, what it costs, how hard it is to set up, and where each falls short.
Open source · MIT
Finds React components that re-render too often, highlighting them in your running app.
Open source · MIT
Zero-config CLI for building, testing, and publishing TypeScript libraries.
The short answer
Choose React Scan if you need…
- Developers debugging slow React pages in development
- Teams looking for unnecessary re-renders without reading every component
- Developers who want a visual overlay rather than manual profiling
- Developers using Next.js, Vite, or Remix, which the README gives setup examples for
Choose TSDX if you need…
- Developers who want to publish a reusable TypeScript library to npm without writing build configuration
- Teams starting a new React component library that want a ready-made template with Testing Library
- Developers already using Bun who want a single tool for building and testing packages
- Maintainers upgrading a v0.x TSDX project who can follow the migration guide
Side-by-side
| React Scan | TSDX | |
|---|---|---|
| Type | Dev tool | Dev tool |
| Price | Free and open source | Free and open source |
| Licence | MIT | MIT |
| GitHub stars | 21.9k | 11.5k |
| Setup difficulty | Beginner | Beginner |
| How you get it | Install with a package manager | Install with a package manager |
| Main language | TypeScript | TypeScript |
| Last code update | 3 months ago | 9 months ago |
What each one is
React Scan
React Scan is a developer tool that watches your React app while it runs and highlights components that re-render unnecessarily, which can make an app slow. It is added with a script tag or an npm install and needs no changes to your code. The README also notes that the project now recommends React Doctor, a related tool aimed at coding agents.
TSDX
TSDX is a command-line tool that sets up and runs the common steps of building a TypeScript library: creating a project from a template, building it into ESM and CommonJS output with type declarations, running tests, linting, and formatting. It aims to work with sensible defaults so you do not have to write much configuration. The README says version 2.0 is a rewrite built on newer tools such as bunchee, vitest, oxlint, and oxfmt, and it uses Bun for package management.
Best for
React Scan
- Developers debugging slow React pages in development
- Teams looking for unnecessary re-renders without reading every component
- Developers who want a visual overlay rather than manual profiling
- Developers using Next.js, Vite, or Remix, which the README gives setup examples for
TSDX
- Developers who want to publish a reusable TypeScript library to npm without writing build configuration
- Teams starting a new React component library that want a ready-made template with Testing Library
- Developers already using Bun who want a single tool for building and testing packages
- Maintainers upgrading a v0.x TSDX project who can follow the migration guide
Strengths
React Scan
- Requires no code changes beyond adding the script or package
- Highlights specific components on screen instead of requiring manual profiling
- Available as an npm package with a guided init command and a browser extension
TSDX
- Sensible defaults mean a new library can start with a single command
- Generates dual ESM and CommonJS output with exports configured automatically
- Covers build, test, lint, format, and typecheck in one CLI
Not ideal for
React Scan
- Production monitoring: the README says forcing it to run in production is 'not recommended', so it is meant for development use
- People who want an automatic code fixer: the description says 'scan and fix', but the README only describes detecting and highlighting issues
- Non-React projects, since it targets React specifically
TSDX
- People building full applications or websites rather than libraries, since the tool is aimed at package development
- Projects that require Node.js older than 20 or cannot use Bun, because the README lists these as requirements
- Teams that need the original Jest and ESLint setup from TSDX v0.x without migrating, since v2.0 replaces those tools
Trade-offs
React Scan
- The README recommends React Doctor for new work, so the project's future direction is less clear
- Detection shows where renders happen but the README does not describe automatic fixes
- Relies on loading the script from unpkg in the manual setup examples
TSDX
- Version 2.0 is a rewrite, so v0.x projects need changes to their tooling and scripts
- Requires Bun for package management, which adds a dependency beyond Node.js
- The README's speed claims are not independently verified here
Getting started
React Scan
Automatic setup (detects framework and installs)
npx -y react-scan@latest initManual install via npm
npm install -D react-scanTSDX
Global install (for creating projects)
bun add -g tsdxPer-project install
bun add -D tsdxFrequently asked questions
What is the difference between React Scan and TSDX?
React Scan: Finds React components that re-render too often, highlighting them in your running app. TSDX: Zero-config CLI for building, testing, and publishing TypeScript libraries. React Scan suits developers debugging slow react pages in development, while TSDX suits developers who want to publish a reusable typescript library to npm without writing build configuration.
Are React Scan and TSDX free?
React Scan: Free and open source. TSDX: Free and open source.
Is React Scan or TSDX more popular?
React Scan has more GitHub stars (21.9k) than TSDX (11.5k). Popularity isn't the same as fit — check which one matches your use case above.
What are other alternatives to React Scan and TSDX?
Other options people compare them with include why-did-you-render, Poetry, Pipenv, pip.
Keep comparing
Built from our catalogue entries for both products: open-source details come from each project's README (AI-assisted, refreshed weekly) and GitHub data; AI-tool details are editorial. Spotted something wrong? Let us know from either product's page.