v1.0.0 — Production Ready

React Performance
Profiler That Scales

Zero-dependency profiler with micro-kernel architecture. Track renders, detect wasted updates, and ship faster React apps.

$
App.tsx
import { ReactScopeProvider, useScope } from '@oxog/reactscope'

function App() {
  return (
    <ReactScopeProvider>
      <Dashboard />
    </ReactScopeProvider>
  )
}

function Dashboard() {
  const scope = useScope('Dashboard')

  return (
    <div>
      <p>Renders: {scope.renderCount}</p>
      <p>Avg: {scope.averageRenderTime.toFixed(2)}ms</p>
      <p>Wasted: {scope.wastedRenders}</p>
    </div>
  )
}
0
Dependencies
10
Built-in Plugins
100%
TypeScript
<5kb
Core Size (gzip)

Everything You Need

Powerful features to profile, analyze, and optimize your React applications.

Render Tracking

Track every component render with precise timing, phase detection, and historical data.

Wasted Render Detection

Automatically identify unnecessary re-renders when props and state haven't changed.

Props Diffing

Deep comparison between renders to identify which props cause updates.

Memory Monitoring

Track heap usage over time and detect potential memory leaks in your app.

Network Correlation

Link network requests to component renders to understand data flow.

Plugin Architecture

Micro-kernel design lets you extend functionality with custom plugins.

10 Built-in Plugins

Ready-to-use plugins for common profiling needs. Mix and match as needed.

📊
Render Tracker
🔍
Props Differ
⚠️
Wasted Detector
🔄
Lifecycle Tracker
💾
Memory Tracker
🌐
Network Correlator
⏱️
Timeline Recorder
📝
Console Reporter
📤
JSON Exporter
🎨
Dashboard UI

Ready to Optimize?

Start profiling your React app in minutes. Zero config required.