MCP SERVERTurn a React DevTools Profiler export into a ranked list of wasted renders and cascade traces — and, for a component that clears the ROI bar, have the file rewritten.
LABSCO SUMMARY
Its gate is the roi_score, and that arrives as an argument rather than being derived from the profile, so whoever calls the tool decides what clears 1.5. The analysis tools have an order baked into them: get_render_summary reports total commits, and trace_render_cascade needs a 0-based commit_index inside that range, so calling the summary first is a precondition rather than a suggestion. Reach extends past render counting — profile_rsc_stream reads a Flight stream log instead of a profile export, and correlate_chrome_trace needs a Chrome trace alongside the profile before it can say anything about INP or CLS.
An analysis server over React DevTools Profiler exports: it reads a profile_path and reports commit cost, spurious renders, cascade shape and memoization candidates, with remediate_component editing component source on disk.
get_render_summary: total commits, total render time, the top 5 slowest components by self time, and the total spurious render count.find_spurious_renders names components that re-rendered with no meaningful prop, state, context or hook change, returning render count, spurious count and wasted milliseconds above a min_render_count floor.get_hottest_components ranks by self CPU time excluding children, with total self ms, average per render and share of total profile time, sized by top_n.trace_render_cascade takes a 0-based commit_index and lists what triggered the commit and everything that re-rendered as a result, sorted by actual duration; trace_state_cascade_footprint measures that cascade's depth and consumer count through the virtual owner tree.suggest_memoization takes min_wasted_ms, and analyze_compiler_efficacy computes an Invalidation Index per component under invalid_threshold.diagnose_hydration_and_suspense finds server-client hydration mismatches and sequential nested Suspense waterfalls against waterfall_threshold_ms, and evaluate_external_store_performance finds useSyncExternalStore selector instability and store updates that block past max_blocking_task_ms.remediate_component hoists static declarations, wraps unstable callbacks and objects in useCallback/useMemo and applies React.memo when the ROI score is above 1.5, while audit_compiler_rules checks a file against compiler memoization safety guidelines such as Date.now(), Math.random() and useRef mutations in render.profile_rsc_stream reads an RSC Flight stream log for chunks over 50KB, waterfall bottlenecks and constructor-traversal hazards, and correlate_chrome_trace aligns commits with a Chrome performance trace to attribute INP and CLS.No credentials are configured. What the tools need is already on disk: a React DevTools Profiler export at profile_path, the component source at file_path for remediate_component and audit_compiler_rules, a Chrome performance trace at trace_path for correlate_chrome_trace, and the Flight stream text handed to profile_rsc_stream as stream_payload.
One command — npx -y react-render-profile-mcp
USE CASES
Get the scale of the problem, list the components re-rendering for no reason, and take the suggestions that clear a wasted-milliseconds floor you set.
Take the commit that covers the interaction and read what set it off, how far it propagated, and which components paid for it.
Measure how often unstable references still invalidate memoization, then check the source for the patterns that make a component ineligible.
Hand over the component name, its file and the unstable props, and let the AST transform land the change on disk.
Look past re-render counting at hydration, Suspense sequencing, external store updates and what the browser was doing at the same moment.
Feed the Flight stream log in and get back the oversized chunks, the sequential request bottlenecks and the traversal hazards.
Counted once with only startup setup. Other versions, modes or optional credentials may expose a different list.
analyze_compiler_efficacyEvaluates React Compiler or manual React.memo efficacy by tracking spurious renders. Calculates the Invalidation Index for each component to identify where unstable prop references trigger wasteful renders.
audit_compiler_rulesAudits a React component file to check if it violates compiler memoization safety guidelines (e.g., Date.now(), Math.random(), useRef mutations in render, 'use no memo' bails).
correlate_chrome_traceAligns React commits with Chrome Performance trace events (re-layout, paint, style calculations) using blink.user_timing ⚛ markers to calculate Core Web Vitals (INP/CLS) impact.
diagnose_hydration_and_suspenseDetects server-client hydration mismatches and sequential nested Suspense waterfalls by analyzing mount durations, unmount events, and timelines.
evaluate_external_store_performanceAnalyzes useSyncExternalStore performance, identifying selector reference instability and concurrency bypasses where heavy store updates block the high-priority main thread.
find_spurious_rendersFinds React components that re-rendered without any meaningful prop, state, context, or hook changes. These are wasted renders caused by unstable references (inline objects/functions/arrays) passed from a parent. Returns component name, total render count, spurious count, and wasted milliseconds. Use to identify the highest-ROI targets for React.memo.
get_hottest_componentsReturns the top N React components ranked by self CPU time (excluding children) across the entire profiling session. Includes total self ms, average per render, and percentage of total profile time. Use to find which components are the most expensive to render, regardless of cause.
get_render_summaryReturns a high-level overview of a React DevTools Profiler export: total commits, total render time, top 5 slowest components by self time, and total spurious (wasted) render count. Use this first to understand the scale of the performance problem before drilling into specifics.
profile_rsc_streamAnalyzes a React Server Components (RSC) Flight stream text log. Detects bloated chunks (>50KB), sequential Waterfall request bottlenecks, and security hazards like constructor traversing exploits (CVE-2025-55182 / React2Shell).
remediate_componentAutomatically optimizes a React component's AST by hoisting static declarations, wrapping unstable callbacks/objects in useCallback/useMemo, and wrapping the component in React.memo if the ROI score is above 1.5. Mutates the file on disk.
suggest_memoizationAnalyzes the profiling data and returns concrete memoization suggestions. Currently detects React.memo candidates: components with spurious renders above the wasted ms threshold. Each suggestion explains why the component re-renders unnecessarily and what to do about it.
trace_render_cascadeFor a specific React commit (render cycle), shows what triggered it and lists every component that re-rendered as a result, sorted by actual duration descending. Reveals propagation — e.g. a context update cascading into 40 children. Call get_render_summary first to find total_commits, then use 0-based commit_index.
trace_state_cascade_footprintReconstructs the virtual parent/owner tree traversal to measure the depth and consumer count of a state update cascade for a specific commit index.
BEFORE YOU INSTALL
13 tools when we connected.
npx on PATH
CONTEXT COST
Rated by the size of the 13 tool definitions that ride along on every turn, not by how many there are
INSTALLATION
Add the block to your client, or run the command directly.
{
"mcpServers": {
"react-render-profile-mcp": {
"command": "npx",
"args": [
"-y",
"react-render-profile-mcp"
]
}
}
}npx -y react-render-profile-mcpMCP servers
Dmitriusan
vola-trebla
twodoorsdev
Phoenixrr2113