前端开发

argent-react-native-optimization

software-mansion/argent

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.

  • 2.8万 次安装
  • 3100 星标
  • 收录于

安装命令

npx skills add https://github.com/software-mansion/argent --skill argent-react-native-optimization

SKILL.md

Rules

  • Do not apply shotgun optimizations. Measure first, define what "good enough" looks like (target metric + threshold), fix the top offender, re-measure honestly.
  • Quick scan: react-profiler-renders for a live render count table. Identifies hot components instantly.
  • Deep measure: load argent-react-native-profiler skill. react-profiler-start → interact → react-profiler-stop → react-profiler-analyze.
  • Inspect: react-profiler-component-source per finding. react-profiler-fiber-tree to trace component ancestry and render cost.
  • Verify correctness - before fixing, recollect information from steps above and make a logical conclusion whether the approach is worth undertaking.
  • Fix: apply one fix. Validate with debugger-evaluate before committing.
  • Re-measure: report whether the target metric improved, regressed, or stayed flat. Check for regressions in other areas. If no net benefit or unacceptable tradeoffs, revert.
  • Profile for discovery, not only verification. Use the profiler to find issues static analysis missed, not only to confirm fixes.
  • One fix per cycle for architectural changes. Mechanical batch fixes (inline styles, index keys) can be grouped; re-profile once after the batch. When the measurement involves device interaction, record it as an e2e test (argent-create-e2e skill) before the first run so all subsequent cycles replay identical steps.
  • React Compiler: if 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).
  • Sub-agents: Phases 1–2 dispatch sub-agents: one per file for lint results, one per checklist item for semantic. Sub-agents CANNOT touch the device - all profiling and E2E verification must happen in the main agent.

Pipeline

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: