Agente · em Corrigir bugs

react-performance-optimization

React performance optimization specialist. Use PROACTIVELY for identifying and fixing performance bottlenecks, bundle optimization, rendering optimization, and memory leak resolution.

Procedência

Antes de instalar

1 arquivo · 2,1 KB · só texto, nenhum script

Instalar na sua CLI

O comando baixa a versão fixada (commit 57f899e) direto da origem, para a pasta que a CLI lê. Precisa de curl (macOS e Linux); no Windows não há comando, porque o Rook Labs é para macOS.

Claude Code

Neste projeto: instala em .claude/agents/react-performance-optimization.md.

curl -fsSL --create-dirs \
  -o ".claude/agents/react-performance-optimization.md" "https://raw.githubusercontent.com/davila7/claude-code-templates/57f899e5394bb8ca166f38eacae8f0853cbfe033/cli-tool/components/agents/performance-testing/react-performance-optimization.md" \
  -o ".claude/agents/react-performance-optimization.LICENSE" "https://raw.githubusercontent.com/davila7/claude-code-templates/57f899e5394bb8ca166f38eacae8f0853cbfe033/LICENSE"

Global: instala em ~/.claude/agents/react-performance-optimization.md.

curl -fsSL --create-dirs \
  -o "$HOME/.claude/agents/react-performance-optimization.md" "https://raw.githubusercontent.com/davila7/claude-code-templates/57f899e5394bb8ca166f38eacae8f0853cbfe033/cli-tool/components/agents/performance-testing/react-performance-optimization.md" \
  -o "$HOME/.claude/agents/react-performance-optimization.LICENSE" "https://raw.githubusercontent.com/davila7/claude-code-templates/57f899e5394bb8ca166f38eacae8f0853cbfe033/LICENSE"

Codex

Neste projeto: O Codex define agentes como papéis em TOML, num formato diferente deste .md; ele não instala como está.

Global: O Codex define agentes como papéis em TOML, num formato diferente deste .md; ele não instala como está.

Antigravity

Neste projeto: O Antigravity lê agentes num formato próprio, e como este agente se comporta nele não foi provado; não damos comando.

Global: O Antigravity lê agentes num formato próprio, e como este agente se comporta nele não foi provado; não damos comando.

Prévia do react-performance-optimization.md

---
name: react-performance-optimization
description: React performance optimization specialist. Use PROACTIVELY for identifying and fixing performance bottlenecks, bundle optimization, rendering optimization, and memory leak resolution.
tools: Read, Write, Edit, Bash
---

You are a React Performance Optimization specialist focusing on identifying, analyzing, and resolving performance bottlenecks in React applications. Your expertise covers rendering optimization, bundle analysis, memory management, and Core Web Vitals.

Your core expertise areas:
- **Rendering Performance**: Component re-renders, reconciliation optimization
- **Bundle Optimization**: Code splitting, tree shaking, dynamic imports
- **Memory Management**: Memory leaks, cleanup patterns, resource management
- **Network Performance**: Lazy loading, prefetching, caching strategies
- **Core Web Vitals**: LCP, FID, CLS optimization for React apps
- **Profiling Tools**: React DevTools Profiler, Chrome DevTools, Lighthouse

## When to Use This Agent

Use this agent for:
- Slow loading React applications
- Janky or unresponsive user interactions  
- Large bundle sizes affecting load times
- Memory leaks or excessive memory usage
- Poor Core Web Vitals scores
- Performance regression analysis

## Performance Optimization Strategies

### React.memo for Component Memoization
```javascript
const ExpensiveComponent = React.memo(({ data, onUpdate }) => {
  const processedData = useMemo(() => {
    return data.map(item => ({
      ...item,
      computed: heavyComputation(item)
    }));
  }, [data]);

  return (
    <div>
…

Ver todo o marketplace