Optimizes a React Native app by profiling first to find real bottlenecks, then sweeping for mechanical issues. Entry-point for all performance work. Use when the app feels slow, user asks to optimize, fix re-renders, reduce jank, or improve startup. Delegates to argent-react-native-profiler for measurement.
68
81%
Does it follow best practices?
Run evals on this skill
Adds up to 20 points to the overall score
View guide
Passed
No findings from the security scan
react-profiler-renders for a live render count table. Identifies hot components instantly.argent-react-native-profiler skill. react-profiler-start → interact → react-profiler-stop → react-profiler-analyze.react-profiler-component-source per finding. react-profiler-fiber-tree to trace component ancestry and render cost.debugger-evaluate before committing.argent-create-flow skill) before the first run so all subsequent cycles replay identical steps.react-profiler-analyze reports reactCompilerEnabled: true, do NOT propose useCallback/useMemo/React.memo unless you confirmed compiler bail-out via react-profiler-fiber-tree (absent useMemoCache).Lint and semantic sweeps catch deterministic issues cheaply. Profiling finds runtime bottlenecks that static analysis misses. Do both.
Copy this checklist into your TODO list:
Optimization Progress:
- [ ] Phase 1: Lint sweep (deterministic — catch mechanical issues without a running app)
- [ ] Phase 2: Semantic sweep (judgment — memoization, lists, animations, etc.)
- [ ] Phase 3: Baseline profile (find real bottlenecks, fix top offenders)
- [ ] Phase 4: Verify no regressions (crashes, errors, red screens)Run ESLint once at the project root with a comprehensive RN performance ruleset. Dispatch sub-agents to fix results — one per file. See references/lint-rules.md for ruleset and procedure.
Review each area requiring judgment — memoization, list rendering, animations, async patterns, effect cleanup, state hygiene, context architecture. Dispatch one sub-agent per checklist item. See references/semantic-checklist.md for full checklist.
argent-react-native-profiler skill, start dual profilingreact-profiler-analyze + native-profiler-analyze + profiler-combined-reportargent-create-flow skill to repair the flow rather than silently discarding it.Navigate every screen and UI flow within scope, confirm each renders without errors. If no scope was specified, verify the entire app — cover all reachable screens via argent-device-interact. Use debugger-log-registry to check for runtime errors and take screenshots to check for red/yellow error screens. Check for regressions introduced by fixes (e.g., fewer re-renders but higher CPU, or new jank in a different screen). Main agent only.
After the entire run, run lint again to verify no new issues were introduced with your changes. This also helps ensure you haven't missed any issues which could've been fixed.
da6d36f
If you maintain this skill, you can claim it as your own. Once claimed, you can manage eval scenarios, bundle related skills, attach documentation or rules, and ensure cross-agent compatibility.