Question 1

How do I integrate React Scan into a Vite project?

Accepted Answer

Add the provided script tag before any other scripts in your index.html file, as shown in the Vite installation example. This ensures React Scan loads early to monitor renders without modifying your source code.

Question 2

React Scan vs Why Did You Render: which should I use?

Accepted Answer

React Scan offers zero-config setup and visual highlighting for quick insights, while Why Did You Render requires manual instrumentation and console logging. Choose React Scan for ease of use; use Why Did You Render for deeper, customizable analysis.

Question 3

Can I use React Scan in production environments?

Accepted Answer

It's not recommended due to performance overhead; the 'dangerouslyForceRunInProduction' option exists but should be used cautiously. Best for development or staging to identify and fix issues before deployment.

Question 4

How to disable the React Scan toolbar on my page?

Accepted Answer

Set the 'showToolbar' option to false using the API or during initialization. This hides the UI while still collecting performance data, useful for custom integrations or minimal interference.

Question 5

Does React Scan work with React Server Components?

Accepted Answer

The README doesn't specify support for React Server Components; since it focuses on client-side renders, it may not effectively analyze server component performance. Check for updates or community discussions.

Question 6

What kind of performance issues does React Scan detect?

Accepted Answer

It primarily identifies unnecessary re-renders caused by prop changes, as explained in the 'Why React Scan?' section. It highlights components that render too often or with expensive computations, helping optimize render cycles.

react-scan

What is react-scan?

Overview

Use Cases

Best For

Related Projects

Found a gem we're missing?

Not Ideal For

Pros & Cons

Pros

Cons

Frequently Asked Questions