argent-react-native-optimization: a skill that speeds up a React Native app by measuring first

argent-react-native-optimization makes your agent speed up a React Native app by profiling first, fixing the top offender and re-measuring.

Installs: 28.1K; on skills.sh
Stars: 3.1K; on GitHub
Files: 3; besides SKILL.md
Updated: Oct 2026; last repo commit

The skill is the entry point for performance work. Its rules forbid shotgun optimizations: the agent measures, sets a target metric and threshold, fixes the top offender, re-measures, and reverts when there is no net gain. It runs four phases: a lint sweep, a semantic sweep, visual profiling, and a regression check.

It triggers when the app feels slow, you ask to optimize, fix re-renders, reduce jank or improve startup. It uses the Argent profiler tools on a running app and delegates measurement to argent-react-native-profiler. Phases 1 and 2 may install ESLint plugins in your project.

Good for

React Native developers whose app feels slow or janky
Teams that want a measured before-and-after, not guesswork
Developers cleaning up re-renders and slow startup

Install argent-react-native-optimization

Claude Code

Copy this prompt.

Install the argent-react-native-optimization skill in Claude Code. Run this command:

npx @swmansion/argent@latest init

Then check that it loaded and tell me how to use it.

2
Paste it into Claude Code. It shows the change and asks before running it.

Requires Node.js.

This runs the Argent installer. It sets up the Argent tools (an MCP server) that these skills call, plus the Argent skills, in the editors you pick. Skills copied on their own with the skills CLI have no tools to call. The installer offers to add Argent tools to your editor's auto-approve list. The default Automatic skills option installs all Argent skills, not only this one. Telemetry is on by default and argent telemetry disable turns it off.

From the project README. Source.

What's in the skill

When it loads

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.

Sections in SKILL.md

Rules
Pipeline
Phase 1: Lint sweep
Phase 2: Semantic sweep
Phase 3: Visual profiling
Phase 4: Verify no regressions
App-wide optimization

Key facts

Author: Software Mansion (Argent)
Repo: software-mansion/argent, path packages/skills/skills/argent-react-native-optimization
Installs on skills.sh: 28,106 (as of Nov 2, 2026)
GitHub stars: 3,138 (shared repo, Nov 2, 2026)
License: Apache-2.0 for source code; some bundled binaries are proprietary
Last repo commit: Oct 31, 2026
Files: 4 files including SKILL.md: references/fix-reference.md, lint-rules.md, semantic-checklist.md
Needs: The Argent tools (MCP server), set up by the installer in the box above

What it includes

Runs ESLint once with React Native performance rules
Uses eslint-plugin-react-perf, react, react-native and react-hooks rules, then dispatches one sub-agent per file to fix results. Installs missing plugins with npm.
Runs code · Phase 1: lint sweep
One sub-agent per checklist item
Seven areas: memoization, list rendering, animations, async patterns, effect cleanup, state hygiene, monolithic context. Monolithic context is flagged, not auto-fixed.
Write · Phase 2: semantic sweep
Dual profiling of key user flows
Loads argent-react-native-profiler, then uses react-profiler-analyze, native-profiler-analyze and profiler-combined-report. Fixes the highest-impact issues and re-profiles.
Runs code · Phase 3: visual profiling
Walks every screen in scope
Uses argent-device-interact, debugger-log-registry and screenshots to look for errors and red or yellow screens. Main agent only.
Phase 4: verify no regressions
react-profiler-renders gives a live render count table
Finds hot components fast, before a full profile.
Quick scan
Maps findings to fixes
For example React.memo, StyleSheet.create, FlatList or FlashList tuning, useNativeDriver or Reanimated, InteractionManager, inline requires. Skips memo hooks when React Compiler is active.
Fix reference

From the official docs

Permissions

Medium risk

It edits your app's source files and may install ESLint plugins, using sub-agents and a running device. Work on a branch so you can revert changes that do not help.

What it can do

Read your data
Create and change things
Delete things
Read-only mode

Watch out for

It edits many files in your project
Sub-agents fix lint and checklist findings file by file, and the main agent applies profiler-led fixes. Use a clean git branch and review the diff. github.com
Installer can auto-approve Argent tools
`argent init` asks whether to add Argent tools to your editor's auto-approve list and its prompt defaults to yes. Say no if you want a confirmation on every tool call. github.com
It may install ESLint plugins
lint-rules.md says to install missing plugins before running, for example `npm install --save-dev eslint-plugin-react-perf`. It may also create a temporary .eslintrc.json when the project has no config. github.com
It drives your app on a device
Profiling and the regression check use device tools, so the app is tapped through and logs are read. Sub-agents cannot touch the device; the main agent does. github.com
Argent telemetry is on by default
The README says telemetry is opt-out. Run `argent telemetry disable` to turn it off; the privacy notice says it collects no source code, file paths or tool inputs, and records a hashed installation identifier derived from a device identifier, never the raw one. github.com

Technical details

Talks to	Argent telemetry (on by default)
Sign-in and keys	The skill text does not use an account or API key.

Questions

What does argent-react-native-optimization do?

It makes your agent find real slowness in a React Native app and fix it with measurements. It lints, reviews code against a checklist, profiles the running app, fixes the top offender and re-measures.

How do I install it in Claude Code?

Use the install box above. It runs the Argent installer, which sets up the profiler and device tools this skill calls, along with the skills.

Does it need other skills?

Yes. It delegates measurement to argent-react-native-profiler, uses argent-device-interact for the regression check and argent-create-e2e for repeatable runs. The Argent installer sets up the Argent skills together.

Will it add useMemo and React.memo everywhere?

No. The rules forbid shotgun optimizations. If React Compiler is reported as enabled, it should not propose useCallback, useMemo or React.memo unless compiler bail-out was confirmed.

Is it safe to run?

It edits source files, may install ESLint plugins and taps through your app, so use a clean git branch. It bundles no scripts. The installer can also add Argent tools to your editor's auto-approve list, which you can decline.

What if a fix does not help?

The rules say to report whether the metric improved, regressed or stayed flat, and to revert when there is no net benefit or the tradeoff is unacceptable.

How is it different from argent-react-native-profiler?

The profiler skill handles measurement. This one is the entry point for the whole job: lint, review, profile, fix and verify.

Information

updated Nov 2, 2026

Repository: software-mansion/argent
Folder: packages/skills/skills/argent-react-native-optimization

software-mansion/argent skills.sh

Sources

Docs, issue trackers and discussions this page is built from.

Show all 8

SKILL.md · github.com
Argent README · github.com
Argent installer: editor adapters · github.com
Argent installer: auto-approve step · github.com
init-skills.ts · github.com
lint-rules.md · github.com
semantic-checklist.md · github.com
fix-reference.md · github.com