Toggle React Scann script injection

Latest Version

Version
1.0
Update
December 6, 2024
Size
34.16KiB
Developer
halpindev.com
Category
Users
15
Rating
0 ★
Manifest Version
3
Web Store Status
Languages Support
English
See more
Permissions
ActiveTab
Scripting
Tabs
See more

React Scann Toggle Extension

The React Scan Chrome extension brings the power of React Scan directly to your browser, allowing you to analyze the performance of any React application with a simple toggle. Identify unnecessary re-renders and optimize your components without modifying any code.

Features:

One-click activation: Easily toggle React Scan on and off for any website.

Visual cues: Instantly see which components are re-rendering and how often.

No code changes required: Analyze any React app without touching its codebase.

Powered by React Scan: Leverages the trusted React Scan library used by teams at Airbnb and more.

Use Cases:

Debugging performance issues: Quickly identify components causing slowdowns.

Optimizing existing applications: Find and eliminate unnecessary re-renders.

Learning about React performance: Visualize how different factors affect rendering behavior.

How it works:

This extension injects the React Scan library into the active tab when enabled. React Scan then analyzes the React component tree and visually highlights components that re-render, providing insights into potential performance bottlenecks.

About React Scan:

React Scan is a powerful tool that simplifies React performance analysis. It helps you pinpoint unnecessary re-renders caused by unstable props, like callbacks or object values. By visualizing these issues, React Scan empowers you to optimize your React applications for optimal performance.

Official Repo: https://github.com/aidenybai/react-scan
Read more

Source Manifest.json

{"update_url": "https://clients2.google.com/service/update2/crx", "manifest_version": 3, "name": "React Scann Toggle", "version": "1.0", "description": "Toggle React Scann script injection", "permissions": ["activeTab", "scripting", "tabs"], "host_permissions": [""], "action": { "default_icon": { "16": "icon16.png", "48": "icon48.png", "128": "icon128.png" } }, "background": { "service_worker": "background.js" }, "web_accessible_resources": [ { "resources": ["inject.js"], "matches": [""] } ]}
Read more

Similar Extensions

icon

Data Extractor Extension · Productivity 15 1 ★ 112KiB

icon

React Query Rewind Extension · Developer Tools 15 4 ★ 538KiB

icon

React Developer Tools Extension · Developer Tools 15 1576 ★ 1.56MiB

icon

Simple JavaScript Disabler Extension · Productivity 15 0 ★ 68.23KiB

icon

JavaScript disable Chrome Extension · Productivity 15 10 ★ 95.44KiB

icon

ScriptRunner - v3 userScript manager Extension · Productivity 15 3 ★ 154KiB

icon

React code finder Extension · Developer Tools 15 5 ★ 2.95MiB

icon

React Hook Form Developer Tools Extension · Developer Tools 15 7 ★ 117KiB

icon

ProseMirror Developer Tools Extension · Developer Tools 15 5 ★ 164KiB

icon

LocatorJS Extension · Developer Tools 15 64 ★ 190KiB

icon

cssPicker - copy css from website Extension · Developer Tools 15 6 ★ 1021KiB

icon

exec JavaScript Extension · Developer Tools 15 1 ★ 329KiB

icon

React Context DevTool Extension · Developer Tools 15 21 ★ 2.35MiB

icon

React Inspector Extension · Developer Tools 15 8 ★ 26.91KiB

icon

React Scan Toggle Extension · Developer Tools 15 3 ★ 48.71KiB

icon

HTML to React & Figma by Magic Patterns Extension · Developer Tools 15 10 ★ 392KiB

icon

Codecov Extension · Developer Tools 15 10 ★ 1.86MiB

icon

Ajax Interceptor Tools Extension · Developer Tools 15 12 ★ 2.31MiB

icon

RSC Devtools Extension · Developer Tools 15 9 ★ 175KiB

icon

Deeper Dive Extension · Developer Tools 15 4 ★ 32.31KiB

icon

HTML to React Extension · Developer Tools 15 4 ★ 342KiB

icon

click-to-react-component Extension · Developer Tools 15 5 ★ 79.5KiB

icon

PageSpeed Insights Extension · Productivity 15 1 ★ 22.64KiB

icon

LambdaTest Extension · Developer Tools 15 19 ★ 629KiB