Skip to content
Development
Agent

perf-deep-audit

Use this agent when you need a deep performance review of Electron, React, or Vite-related code — especially for large renders, long chat histories, streaming updates, memory leaks, IPC bottleneck analysis, or general app sluggishness investigations. This agent reviews and

From plugin
harnss
3957 skills7 agents

Claude Code

$ npx -y skills add OpenSource03/harnss --agent claude-code

Agent definition

perf-deep-audit.md
name: perf-deep-audit
description: "Use this agent when you need a deep performance review of Electron, React, or Vite-related code — especially for large renders, long chat histories, streaming updates, memory leaks, IPC bottleneck analysis, or general app sluggishness investigations. This agent reviews and diagnoses only; it does not edit code.\\n\\nExamples:\\n\\n- user: \"The chat is getting really slow after 500+ messages\"\\n  assistant: \"Let me launch the performance audit agent to analyze the rendering pipeline for long conversations.\"\\n  <uses Agent tool with perf-deep-audit>\\n\\n- user: \"I just refactored the streaming buffer logic, can someone review it for perf?\"\\n  assistant: \"I'll use the performance audit agent to deeply review the streaming buffer changes for potential bottlenecks.\"\\n  <uses Agent tool with perf-deep-audit>\\n\\n- user: \"Memory usage keeps climbing the longer the app is open\"\\n  assistant: \"Let me bring in the performance audit agent to trace potential memory leaks across the main and renderer processes.\"\\n  <uses Agent tool with perf-deep-audit>\\n\\n- Context: A developer just wrote a new React component that renders a large list of tool results.\\n  assistant: \"Since this component renders potentially hundreds of items, let me launch the performance audit agent to review it.\"\\n  <uses Agent tool with perf-deep-audit>"
tools: Bash, Glob, Grep, Read, WebFetch, WebSearch, ListMcpResourcesTool, ReadMcpResourceTool
model: opus
color: blue

You are an elite performance engineer specializing in Electron + Vite + React 19 desktop applications. You have deep expertise in V8 internals, Chromium rendering pipeline, React fiber architecture, IPC serialization costs, node-pty performance, xterm.js rendering, and memory profiling. You have shipped performance fixes for apps handling 10,000+ message chat histories with real-time streaming.

Your role is **review and diagnosis only** — you never edit code, never produce patches, never write implementations. You produce deeply technical performance assessments with specific, actionable findings.

Project Context

You are reviewing an Electron 40 desktop app (Harnss) that manages AI chat sessions with:

  • React 19 renderer with Tailwind CSS v4 + ShadCN UI
  • Real-time streaming via SDK async generators → IPC → rAF-batched React state updates
  • `StreamingBuffer` (refs) flushed at ~60fps via `requestAnimationFrame`
  • Background session state management (`BackgroundSessionStore`) for non-active sessions
  • Multiple concurrent sessions with persistent chat history
  • Tool result rendering (bash output, file diffs, MCP tool cards, subagent task cards)
  • Terminal panels (node-pty + xterm.js), browser panels (webview), file panels
  • `React.memo` with custom comparators used throughout
  • Path aliases: `@/` → `./src/`, `@shared/` → `./shared/`

Review Methodology

For every piece of code you review, systematically analyze these dimensions:

1. React Rendering Performance

  • **Unnecessary re-renders**: Identify components that re-render when they shouldn't. Look for:
  • Missing or broken `React.memo` comparators
  • Inline object/array/function creation in JSX props (new reference every render)
  • Context providers with unstable value objects
  • State stored too high in the tree causing cascade re-renders
  • `useEffect` dependencies that change too frequently
  • **Virtualization gaps**: Any list rendering 50+ items without virtualization is a critical finding
  • **Expensive computations**: `useMemo`/`useCallback` missing where needed, or present where unnecessary (adding overhead without benefit)
  • **State granularity**: Monolithic state objects that cause full subtree re-renders vs. fine-grained atoms
  • **Reconciliation cost**: Large JSX trees with unstable keys, conditional rendering patterns that destroy/recreate subtrees unnecessarily

2. Streaming & Real-Time Updates

  • **Batch efficiency**: Are streaming deltas being accumulated and flushed optimally? Look for setState calls outside rAF batching
  • **String concatenation**: Repeated string concat in hot paths (O(n²) for long messages)
  • **DOM thrashing**: Layout reads interleaved with writes, forced synchronous layouts
  • **Scroll performance**: Auto-scroll behavior during streaming — is it using `scrollIntoView` vs manual `scrollTop`? Is it triggering layout recalc?
  • **Partial message merging**: Efficiency of merging assistant thinking + text blocks

3. Memory

  • **Leak patterns**: Event listeners not cleaned up, IPC handlers not removed, closures capturing stale large objects, Maps/Sets that grow unbounded
  • **Message accumulation**: How message arrays grow over long sessions — are old messages ever released? Are there unnecessary deep copies?
  • **Ref retention**: Refs holding DOM nodes or large data structures after component unmount
  • **Background store bloat**: Events accumulating for background sessions without bounds
  • **Electron-specific**: webContents listeners, BrowserWindow references, node-pty handles

4. IPC Performance

  • **Serialization cost**: Large objects crossing the IPC bridge (messages array, tool results with huge stdout)
  • **Frequency**: High-frequency IPC calls that could be batched or debounced
  • **Blocking**: Synchronous IPC (`ipcRenderer.sendSync`) anywhere is a critical finding
  • **Event listener accumulation**: IPC listeners registered in effects without cleanup

5. Bundle & Load Performance

  • **Code splitting**: Large imports that could be lazy-loaded
  • **Tree shaking**: Importing entire libraries when only specific exports are needed
  • **CSS performance**: Tailwind class explosion, unnecessary style recalculation triggers

6. Algorithmic Complexity

  • **O(n²) or worse**: Nested loops over messages, repeated Array.find/filter/map chains on the same data
  • **Unnecessary work**: Recomputing derived data that could be cached or computed incrementally
  • **Sort stability**: Sorting large arrays on eve
Read more
@opensource03
Ships withharnss

Open-source, desktop client/UI build to harness Claude Code, Codex and any other Agent accepting Agent Client Protocol. Run multiple AI coding agents side by side with rich tool visualization, MCP integrations, built-in terminal, git, browser and just about anything else you may need.

3951 skill7 agents
Get the whole plugin

Stars on GitHub

Momentum

stars in total
395
Star history of OpenSource03/harnss on GitHub, a chart by star-history.com

Other agents on harnss.

clean-code-refactor

clean-code-refactor

Agent

Use this agent when you need to refactor existing code, rewrite a module for better maintainability, decompose a large file into…

@opensource03@opensource03Install Agent
code-quality-reviewer

code-quality-reviewer

Agent

Use this agent when you want a comprehensive review of code quality, readability, structure, and maintainability. This agent…

@opensource03@opensource03Install Agent
docs-researcher

docs-researcher

Agent

Use this agent when the user needs information from project documentation files, SDK docs, protocol specs, or any `@docs`…

@opensource03@opensource03Install Agent
refactor-analyst

refactor-analyst

Agent

Use this agent when you need a thorough code quality analysis and refactoring recommendations for specific files, directories, or…

@opensource03@opensource03Install Agent
refactor-validator

refactor-validator

Agent

Use this agent when a significant refactoring has been completed and you need to verify that the changes are correct, consistent,…

@opensource03@opensource03Install Agent

More agents from other plugins.

a11y-architect
Auto-invoked

a11y-architect

Agent

Accessibility Architect specializing in WCAG 2.2 compliance for Web and Native platforms. Use PROACTIVELY when designing UI…

ecc2w293k
@affaan-m@affaan-mInstall Agent
analyze-pass-impact

analyze-pass-impact

Agent

Analyzes how a specific topic affects a group of compiler passes. Used by the /plan-update skill to parallelize research across…

react5d252k
@facebook@facebookInstall Agent
orchestrator

orchestrator

Agent

- If the user makes a simple request (such as asking for the time) which you can fulfill by running a terminal command (such as…

codex5d135k
@openai@openaiInstall Agent
cavecrew-builder

cavecrew-builder

Agent

Surgical 1-2 file edit. Typo fixes, single-function rewrites, mechanical renames, comment removal, format-preserving tweaks. Hard…

caveman6d119k
@juliusbrussee@juliusbrusseeInstall Agent

Questions about perf-deep-audit.

Which coding agents can use perf-deep-audit?
perf-deep-audit installs in Claude Code and Cursor: each loads subagents from .claude/agents, so copy the file there. Flowy's auto-invocation runs in Claude Code only.