Argent React Native Optimization
bbplayer-app/BBPlayer
Optimizes a React Native app by profiling first to find real bottlenecks, then sweeping for mechanical issues.
Official agent skill
React Native Best Practices
Provides React Native performance optimization guidelines for FPS, TTI, bundle size, memory leaks, re-renders, and animations.
Install React Native Best Practices
$ npx skills add callstackincubator/agent-skills --skill react-native-best-practices -a claude-codeProject install by default; add -g for ~/.claude/skills/.
$ gh skill install callstackincubator/agent-skills react-native-best-practices --agent claude-codeProject scope by default; add --scope user for a personal install. Needs GitHub CLI 2.90.0 or later (public preview).
$ git clone --depth 1 https://github.com/callstackincubator/agent-skills.git skills-src && mkdir -p .claude/skills && cp -r skills-src/skills/react-native-best-practices .claude/skills/react-native-best-practices && rm -rf skills-srcUse ~/.claude/skills/ instead of .claude/skills for a personal install. The folder must contain SKILL.md.
Claude Code skills documentation · loads skills from .claude/skills/
Install the "react-native-best-practices" agent skill from https://github.com/callstackincubator/agent-skills/tree/main/skills/react-native-best-practices into .claude/skills/react-native-best-practices/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "react-native-best-practices", then confirm the skill loads.Claude Code copies the folder itself, the same result as the manual copy. Check what it changed before you commit it.
$skill-installer install https://github.com/callstackincubator/agent-skills/tree/main/skills/react-native-best-practicesType this inside Codex. $skill-installer <name> installs a curated skill from openai/skills. The installer writes to $CODEX_HOME/skills (default ~/.codex/skills). Restart Codex if the skill does not show up.
$ npx skills add callstackincubator/agent-skills --skill react-native-best-practices -a codexProject install goes to .agents/skills/; add -g for ~/.codex/skills/.
$ gh skill install callstackincubator/agent-skills react-native-best-practices --agent codexProject scope by default (.agents/skills/); add --scope user for a personal install.
$ git clone --depth 1 https://github.com/callstackincubator/agent-skills.git skills-src && mkdir -p .agents/skills && cp -r skills-src/skills/react-native-best-practices .agents/skills/react-native-best-practices && rm -rf skills-srcUse ~/.agents/skills/ instead of .agents/skills for a personal install.
Codex skills documentation · loads skills from .agents/skills/
Install the "react-native-best-practices" agent skill from https://github.com/callstackincubator/agent-skills/tree/main/skills/react-native-best-practices into .agents/skills/react-native-best-practices/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "react-native-best-practices", then confirm the skill loads.Codex copies the folder itself, the same result as the manual copy. Check what it changed before you commit it.
$ npx skills add callstackincubator/agent-skills --skill react-native-best-practices -a cursorProject install goes to .agents/skills/; add -g for ~/.cursor/skills/.
$ gh skill install callstackincubator/agent-skills react-native-best-practices --agent cursorProject scope by default (.agents/skills/); add --scope user for a personal install.
$ git clone --depth 1 https://github.com/callstackincubator/agent-skills.git skills-src && mkdir -p .cursor/skills && cp -r skills-src/skills/react-native-best-practices .cursor/skills/react-native-best-practices && rm -rf skills-srcUse ~/.cursor/skills/ instead of .cursor/skills for a personal install.
Cursor skills documentation · loads skills from .cursor/skills/, .agents/skills/, .claude/skills/, .codex/skills/
Install the "react-native-best-practices" agent skill from https://github.com/callstackincubator/agent-skills/tree/main/skills/react-native-best-practices into .cursor/skills/react-native-best-practices/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "react-native-best-practices", then confirm the skill loads.Cursor copies the folder itself, the same result as the manual copy. Check what it changed before you commit it.
$ gemini skills install https://github.com/callstackincubator/agent-skills.git --path skills/react-native-best-practices--scope user (default) or --scope workspace; --path is the subfolder of the repo that holds the skill; --consent skips the security confirmation prompt.
$ npx skills add callstackincubator/agent-skills --skill react-native-best-practices -a gemini-cliProject install goes to .agents/skills/; add -g for ~/.gemini/skills/.
$ gh skill install callstackincubator/agent-skills react-native-best-practices --agent gemini-cliProject scope by default (.agents/skills/); add --scope user for a personal install.
$ git clone --depth 1 https://github.com/callstackincubator/agent-skills.git skills-src && mkdir -p .gemini/skills && cp -r skills-src/skills/react-native-best-practices .gemini/skills/react-native-best-practices && rm -rf skills-srcUse ~/.gemini/skills/ instead of .gemini/skills for a personal install, then run /skills reload.
Gemini CLI skills documentation · loads skills from .gemini/skills/, .agents/skills/
Install the "react-native-best-practices" agent skill from https://github.com/callstackincubator/agent-skills/tree/main/skills/react-native-best-practices into .gemini/skills/react-native-best-practices/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "react-native-best-practices", then confirm the skill loads.Gemini CLI copies the folder itself, the same result as the manual copy. Check what it changed before you commit it.
$ gh skill install callstackincubator/agent-skills react-native-best-practicesInstalls for Copilot at project scope by default; add --scope user for a personal install. Preview a skill first with gh skill preview. Needs GitHub CLI 2.90.0 or later (public preview).
$ npx skills add callstackincubator/agent-skills --skill react-native-best-practices -a github-copilotProject install goes to .agents/skills/; add -g for ~/.copilot/skills/.
$ git clone --depth 1 https://github.com/callstackincubator/agent-skills.git skills-src && mkdir -p .github/skills && cp -r skills-src/skills/react-native-best-practices .github/skills/react-native-best-practices && rm -rf skills-srcUse ~/.copilot/skills/ instead of .github/skills for a personal install. Commit .github/skills so cloud agent and code review can use it.
GitHub Copilot skills documentation · loads skills from .github/skills/, .claude/skills/, .agents/skills/
Install the "react-native-best-practices" agent skill from https://github.com/callstackincubator/agent-skills/tree/main/skills/react-native-best-practices into .github/skills/react-native-best-practices/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "react-native-best-practices", then confirm the skill loads.GitHub Copilot copies the folder itself, the same result as the manual copy. Check what it changed before you commit it.
$ npx skills add callstackincubator/agent-skills --skill react-native-best-practices -a opencodeOpenCode documents no install command of its own. Project install goes to .agents/skills/; add -g for ~/.config/opencode/skills/.
$ gh skill install callstackincubator/agent-skills react-native-best-practices --agent opencodeProject scope by default (.agents/skills/); add --scope user for a personal install.
$ git clone --depth 1 https://github.com/callstackincubator/agent-skills.git skills-src && mkdir -p .opencode/skills && cp -r skills-src/skills/react-native-best-practices .opencode/skills/react-native-best-practices && rm -rf skills-srcUse ~/.config/opencode/skills/ instead of .opencode/skills for a personal install.
OpenCode skills documentation · loads skills from .opencode/skills/, .claude/skills/, .agents/skills/
Install the "react-native-best-practices" agent skill from https://github.com/callstackincubator/agent-skills/tree/main/skills/react-native-best-practices into .opencode/skills/react-native-best-practices/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "react-native-best-practices", then confirm the skill loads.OpenCode copies the folder itself, the same result as the manual copy. Check what it changed before you commit it.
Facts
- Skill name
react-native-best-practices- GitHub stars
- 1.7k
- Used in
- 4 other repos
- Token cost
- ~3.1k tokens
- SKILL.md length
- 946 words
- Files
- 44 (incl. references)
- Skills in repo
- 12
- Repo updated
- First seen
- Licence
- MIT
At a glance
Provides React Native performance optimization guidelines for FPS, TTI, bundle size, memory leaks, re-renders, and animations.
- Works in 4 steps: Measure: Capture baseline metrics before… → Optimize: Apply the targeted fix from… → Re-measure: Run the same measurement to… → …
- Tasks that involve Cross-platform mobile apps
- SKILL.md covers Overview, When to Apply, Security Notes and Priority-Ordered Guidelines, plus 4 more sections
- Calls npx
What it does
React Native Best Practices is an agent skill from callstackincubator/agent-skills, published by the product's own GitHub organization. Provides React Native performance optimization guidelines for FPS, TTI, bundle size, memory leaks, re-renders, and animations. Applies to tasks involving Hermes optimization, JS thread blocking, bridge overhead, FlashList, native modules, or debugging jank and frame drops.
Its SKILL.md is about 3.1k tokens, which your agent loads only when the skill is triggered. The skill folder holds 46 other files, including reference files (for example `POWER.md`, `agents/openai.yaml` and `references/bundle-analyze-app.md`).
It sits in Mobile, covering Cross-platform mobile apps, Performance optimization and Web performance. It works with React Native. The repository describes itself as: A collection of agent-optimized React Native skills for AI coding assistants. The licence is MIT.
When your agent uses it
- Tasks that involve Cross-platform mobile apps
- Tasks that involve Performance optimization
- Tasks that involve Web performance
Example prompts
- “Use the react-native-best-practices skill to provide React Native performance optimization guidelines for FPS, TTI, bundle size, memory leaks…”
- “/react-native-best-practices”
Requirements
- Node.js
Workflow steps
4 steps, taken from the first numbered list in SKILL.md.
- Measure: Capture baseline metrics before changes. For runtime issues, prefer commit timeline, re-render counts, slow components…
- Optimize: Apply the targeted fix from the relevant reference
- Re-measure: Run the same measurement to get updated metrics
- Validate: Confirm improvement (e.g., FPS 45→60, TTI 3.2s→1.8s, bundle 2.1MB→1.6MB)
What it can do on your machine
Read from SKILL.md and the folder at commit 61e6e7d. It shows what the files ask for, not the result of running them.
Tool permissions
Pre-approves nothing: there is no allowed-tools line, so your agent's usual permission prompts apply.
From allowed-tools in the SKILL.md frontmatter.
Runs code
Shell commands in SKILL.md call:
npx
From the folder's file list and the shell code blocks in SKILL.md.
Network
Links to these hosts (documentation or services it may open):
github.com
From URLs in SKILL.md, links to its own repository left out.
Credentials
Names no API keys, tokens, secrets or passwords.
From names ending in _API_KEY, _TOKEN, _SECRET, _KEY or _PASSWORD in SKILL.md.
Context cost
React Native Best Practices loads about 3.1k tokens when it runs, and up to ~1.7M if it reads all its reference files. Until then it costs about 75 tokens; SKILL.md has 946 words of instructions outside code blocks.
Estimates: characters ÷ 4, the usual rule of thumb; real counts depend on the model's tokenizer. Scripts and assets cost tokens only if the agent reads them.
Safety
Auto-check passed
The automated check found no risky patterns in SKILL.md.
Automated static check — not a guarantee. Review scripts before installing. It scans the text of SKILL.md for risky patterns (piping downloads into a shell, reading credential files, hidden Unicode, destructive commands); files beside SKILL.md are not scanned.
SKILL.md
The full file from callstackincubator/agent-skills at commit 61e6e7d, republished under its MIT licence (© callstackincubator). 946 words, ~3,080 tokens.
Download SKILL.mdSave it as
.claude/skills/react-native-best-practices/SKILL.md (or your agent's skills folder). This skill also uses 43 other files; get the full folder from GitHub.- name
- react-native-best-practices
- description
- Provides React Native performance optimization guidelines for FPS, TTI, bundle size, memory leaks, re-renders, and animations. Applies to tasks involving Hermes optimization, JS thread blocking, bridge overhead, FlashList, native modules, or debugging jank and frame drops.
- license
- MIT
React Native Best Practices
Overview
Performance optimization guide for React Native applications, covering JavaScript/React, Native (iOS/Android), and bundling optimizations. Based on Callstack's "Ultimate Guide to React Native Optimization".
When to Apply
Reference these guidelines when:
- Debugging slow/janky UI or animations
- Investigating memory leaks (JS or native)
- Optimizing app startup time (TTI)
- Reducing bundle or app size
- Writing native modules (Turbo Modules)
- Profiling React Native performance
- Reviewing React Native code for performance
Security Notes
- Treat shell commands in these references as local developer operations. Review them before running, prefer version-pinned tooling, and avoid piping remote scripts directly to a shell.
- Treat third-party libraries and plugins as dependencies that still require normal supply-chain controls: pin versions, verify provenance, and update through your standard review process.
- Treat remote chunk loading as first-party artifact delivery only. Prefer app-bundled chunks or signed CI release manifests; hosted chunks must come from trusted HTTPS origins you control and be pinned to the current app release.
Priority-Ordered Guidelines
| Priority | Category | Impact | Prefix |
|---|---|---|---|
| 1 | FPS & Re-renders | CRITICAL | js-* |
| 2 | Bundle Size | CRITICAL | bundle-* |
| 3 | TTI Optimization | HIGH | native-*, bundle-* |
| 4 | Native Performance | HIGH | native-* |
| 5 | Memory Management | MEDIUM-HIGH | js-*, native-* |
| 6 | Animations | MEDIUM | js-* |
Impact labels are triage hints: CRITICAL first, HIGH next, MEDIUM when evidence points there.
Quick Reference
Optimization Workflow
Follow this cycle for any performance issue: Measure → Optimize → Re-measure → Validate
- Measure: Capture baseline metrics before changes. For runtime issues, prefer commit timeline, re-render counts, slow components, heaviest-commit breakdown, and startup/TTI when available. Component tree depth or count are optional context, not substitutes. Do not recommend memoization, atomic state, or compiler changes without a measured render or FPS problem.
- Optimize: Apply the targeted fix from the relevant reference
- Re-measure: Run the same measurement to get updated metrics
- Validate: Confirm improvement (e.g., FPS 45→60, TTI 3.2s→1.8s, bundle 2.1MB→1.6MB)
If metrics did not improve, revert and try the next suggested fix.
Review Guardrails
- Check library versions before suggesting API-specific fixes. Example: FlashList v2 deprecates
estimatedItemSize, so do not flag it as missing there. - Do not suggest
useMemooruseCallbackdependency changes unless behavior is demonstrably incorrect or profiling shows wasted work tied to that value. - Do not report stale closures speculatively. Show the stale read path, a repro, or profiler evidence before calling it out.
- When profiling a flow, measure the target interaction itself. Do not treat component tree depth or component count as the main performance evidence.
Critical: FPS & Re-renders
Profile first:
agent-device react-devtools status
agent-device react-devtools wait --connected
agent-device react-devtools profile start
agent-device react-devtools profile stop
agent-device react-devtools profile slow --limit 5
agent-device react-devtools profile rerenders --limit 5
agent-device react-devtools profile timeline --limit 20Drive the target interaction with normal agent-device commands between profile start and profile stop.
Manual fallback when agent-device is unavailable: open React Native DevTools from Metro (j) or the Dev Menu, use the Profiler tab, and record the same interaction.
For release-build React component profiling, connect @callstack/inspector first so React DevTools can attach to the release app, then run the agent-device react-devtools flow above.
Common fixes:
- Replace ScrollView with FlatList/FlashList/Legend List for long lists
- After profiling shows cascading re-renders, use React Compiler for automatic memoization
- After profiling shows broad store/context updates, use atomic state (Jotai/Zustand) to reduce re-renders
- Use
useDeferredValuefor expensive computations
Critical: Bundle Size
Analyze bundle:
npx react-native bundle \
--entry-file index.js \
--bundle-output output.js \
--platform ios \
--sourcemap-output output.js.map \
--dev false --minify true
npx source-map-explorer output.js --no-border-checksVerify improvement after optimization:
# Record baseline size before changes
ls -lh output.js # e.g., Before: 2.1 MB
# After applying fixes, re-bundle and compare
npx react-native bundle --entry-file index.js --bundle-output output.js \
--platform ios --dev false --minify true
ls -lh output.js # e.g., After: 1.6 MB (24% reduction)Common fixes:
- Avoid barrel imports (import directly from source)
- Remove unnecessary Intl polyfills only after checking Hermes API and method coverage
- Evaluate tree shaking (Expo SDK 52+ experimental unused import/export removal, or Re.Pack only if already configured)
- Enable R8 for Android native code shrinking
Show full SKILL.md (382 more words)Show less
High: TTI Optimization
Measure TTI:
- Use
react-native-performancefor markers - Only measure cold starts (exclude warm/hot/prewarm)
Common fixes:
- For React Native 0.78 and earlier, disable Android JS bundle compression to enable Hermes mmap
- Use native navigation (react-native-screens)
- Preload commonly-used expensive screens before navigating to them
High: Native Performance
Profile native:
- iOS: Xcode Instruments → Time Profiler
- Android: Android Studio → CPU Profiler
Common fixes:
- Use background threads for heavy native work
- Prefer async over sync Turbo Module methods
- Use C++ for cross-platform performance-critical code
References
Full documentation with code examples in references/:
JavaScript/React (js-*)
| File | Impact | Description |
|---|---|---|
| js-lists-flatlist-flashlist.md | CRITICAL | Replace ScrollView with virtualized lists |
| js-profile-react.md | MEDIUM | agent-device react-devtools profiling |
| js-measure-fps.md | HIGH | FPS monitoring and measurement |
| js-memory-leaks.md | MEDIUM | JS memory leak hunting |
| js-atomic-state.md | HIGH | Jotai/Zustand patterns |
| js-concurrent-react.md | HIGH | useDeferredValue, useTransition |
| js-react-compiler.md | HIGH | Automatic memoization |
| js-animations-reanimated.md | MEDIUM | Reanimated worklets |
| js-bottomsheet.md | HIGH | Bottom sheet optimization |
| js-uncontrolled-components.md | HIGH | TextInput optimization |
Native (native-*)
| File | Impact | Description |
|---|---|---|
| native-turbo-modules.md | HIGH | Building fast native modules |
| native-sdks-over-polyfills.md | HIGH | Native vs JS libraries |
| native-measure-tti.md | HIGH | TTI measurement setup |
| native-threading-model.md | HIGH | Turbo Module threads |
| native-profiling.md | MEDIUM | Xcode/Android Studio profiling |
| native-platform-setup.md | MEDIUM | iOS/Android tooling guide |
| native-view-flattening.md | MEDIUM | View hierarchy debugging |
| native-memory-patterns.md | MEDIUM | C++/Swift/Kotlin memory |
| native-memory-leaks.md | MEDIUM | Native memory leak hunting |
| native-android-16kb-alignment.md | CRITICAL | Third-party library alignment for Google Play |
Bundling (bundle-*)
| File | Impact | Description |
|---|---|---|
| bundle-barrel-exports.md | CRITICAL | Avoid barrel imports |
| bundle-analyze-js.md | CRITICAL | JS bundle visualization |
| bundle-tree-shaking.md | HIGH | Dead code elimination |
| bundle-analyze-app.md | HIGH | App size analysis |
| bundle-r8-android.md | HIGH | Android code shrinking |
| bundle-hermes-mmap.md | HIGH | Disable bundle compression |
| bundle-native-assets.md | HIGH | Asset catalog setup |
| bundle-library-size.md | MEDIUM | Evaluate dependencies |
| bundle-code-splitting.md | MEDIUM | Remote chunk loading safeguards |
Problem → Skill Mapping
| Problem | Start With |
|---|---|
| App feels slow/janky | js-measure-fps.md → js-profile-react.md |
| Too many re-renders | js-profile-react.md → js-react-compiler.md |
| Slow startup (TTI) | native-measure-tti.md → bundle-analyze-js.md |
| Large app size | bundle-analyze-app.md → bundle-r8-android.md |
| Memory growing | js-memory-leaks.md or native-memory-leaks.md |
| Animation drops frames | js-animations-reanimated.md |
| Bottom sheet jank/re-renders | js-bottomsheet.md → js-animations-reanimated.md |
| List scroll jank | js-lists-flatlist-flashlist.md |
| TextInput lag | js-uncontrolled-components.md |
| Native module slow | native-turbo-modules.md → native-threading-model.md |
| Native library alignment issue | native-android-16kb-alignment.md |
Attribution
Based on "The Ultimate Guide to React Native Optimization" by Callstack.
© callstackincubator, MIT. Rendered from Markdown: HTML in the file is shown as text, images as links, and headings moved down two levels. Raw file
Files
SKILL.md and 43 other files (references) in skills/react-native-best-practices of callstackincubator/agent-skills.
- SKILL.md
- POWER.md
- agents/openai.yaml
- references/bundle-analyze-app.md
- references/bundle-analyze-js.md
- references/bundle-barrel-exports.md
- references/bundle-code-splitting.md
- references/bundle-hermes-mmap.md
- references/bundle-library-size.md
- references/bundle-native-assets.md
- references/bundle-r8-android.md
- references/bundle-tree-shaking.md
- references/images/bundle-treemap-source-map-explorer.png
- references/images/controlled-textinput-pingpong.png
- references/images/devtools-flamegraph.png
- references/images/emerge-xray-ios.png
- references/images/expo-atlas-treemap.png
- references/images/flashlight-flatlist-vs-flashlist.png
- … and 26 more
Open the folder on GitHubat commit 61e6e7d
Used in 4 other repositories
We found 4 copies of this SKILL.md (exact, near-identical or edited) in other folders, from 4 other GitHub owners. This page covers the copy in callstackincubator/agent-skills, which our catalogue first saw on October 7, 2026.
Compare with similar skills
React Native Best Practices next to the 5 skills that share the most tags, products or categories with it. Stars are the repository's; “used in” counts other GitHub owners with a copy.
| Skill | Stars | Used in | Tokens | Auto-check | Licence | Repo updated |
|---|---|---|---|---|---|---|
| React Native Best Practices this skillcallstackincubator/agent-skills | 1.7k | 4 repos | ~3.1k | Automated safety check: Pass | MIT | |
| Argent React Native Optimizationbbplayer-app/BBPlayer | 1.1k | — | ~1.3k | Automated safety check: Pass | MIT | |
| PerformanceSidiora-Labs/centra-llm-agents | 115 | — | ~778 | Automated safety check: Pass | Custom licence | |
| React Native Best Practicesvercel-labs/openreview | 1.7k | 17 repos | ~1.1k | Automated safety check: Pass | MIT | |
| React Native Experttech-leads-club/agent-skills | 7k | — | ~3.2k | Automated safety check: Pass | CC-BY-4.0 | |
| Perf BenchmarkingGetStream/stream-chat-react-native | 1.2k | — | ~5.6k | Automated safety check: Pass | Custom licence |
Similar skills
Performance
Sidiora-Labs/centra-llm-agents
Performance optimization guidelines for React/React Native applications.
- Official
React Native Best Practices
vercel-labs/openreview
A prioritized rule set for React Native and Expo apps covering list performance, animation, navigation, UI patterns, state, rendering, monorepos and configuration.
React Native Expert
tech-leads-club/agent-skills
Guides React Native and Expo work for cross-platform apps: Expo Router navigation, fast lists, Reanimated animation, platform-specific code and project structure.
Perf Benchmarking
GetStream/stream-chat-react-native
Measure React Native performance on-device for stream-chat-react-native — Hermes CPU profiles, deterministic call/listener counting, component render profiling, and memory/jank capture.
React Native Expert
Jeffallan/claude-skills
Builds React Native and Expo apps for iOS and Android: Expo Router navigation, FlatList tuning, platform-specific code and build error recovery.
More from callstackincubator/agent-skills
All 12 skills in this repo- Official
Dogfood
callstackincubator/agent-skills
Systematically explore and test a mobile app on iOS/Android with agent-device to find bugs, UX issues, and other problems.
- Official
Upgrading React Native
callstackincubator/agent-skills
Upgrades React Native apps to newer versions by applying rn-diff-purge template diffs, updating package.json dependencies, migrating native iOS and Android configuration, resolving CocoaPods and…
- Official
Create React Native Library
callstackincubator/agent-skills
Scaffolds React Native libraries with create-react-native-library for standalone libraries or local native modules and views.
- Official
React Native Testing
callstackincubator/agent-skills
Write tests using React Native Testing Library (RNTL) v13 and v14 (@testing-library/react-native).
- Official
Assess React Native Migration
callstackincubator/agent-skills
Assesses whether and how an existing mobile product should migrate to React Native.
- Official
GitHub Actions
callstackincubator/agent-skills
GitHub Actions workflow patterns for React Native iOS simulator and Android emulator cloud builds with downloadable artifacts.
Related
Works with
Categories
Questions about React Native Best Practices
What does React Native Best Practices do?
Provides React Native performance optimization guidelines for FPS, TTI, bundle size, memory leaks, re-renders, and animations. React Native Best Practices is an agent skill from callstackincubator/agent-skills, published by the product's own GitHub organization. Provides React Native performance optimization guidelines for FPS, TTI, bundle size, memory leaks, re-renders, and animations.
When should I use React Native Best Practices?
React Native Best Practices fits situations like: tasks that involve Cross-platform mobile apps; tasks that involve Performance optimization; tasks that involve Web performance.
How do I install React Native Best Practices in Claude Code?
Run `npx skills add callstackincubator/agent-skills --skill react-native-best-practices -a claude-code`. Or copy the skill folder (skills/react-native-best-practices in callstackincubator/agent-skills) into .claude/skills/react-native-best-practices in your project. Claude Code loads it when a task matches its description.
How do I install React Native Best Practices in Codex?
Run `npx skills add callstackincubator/agent-skills --skill react-native-best-practices -a codex`. Or copy the skill folder (skills/react-native-best-practices in callstackincubator/agent-skills) into .agents/skills/react-native-best-practices in your project. Codex loads it when a task matches its description.
Can I use React Native Best Practices in Cursor, Gemini CLI or GitHub Copilot?
Cursor, Gemini CLI, GitHub Copilot and OpenCode also load SKILL.md folders. With the skills CLI, run `npx skills add callstackincubator/agent-skills --skill react-native-best-practices -a cursor` (or -a gemini-cli, github-copilot or opencode for the others). To copy it by hand, put the folder in .cursor/skills/react-native-best-practices, .gemini/skills/react-native-best-practices, .github/skills/react-native-best-practices and .opencode/skills/react-native-best-practices in your project.
What does React Native Best Practices need to run?
Going by SKILL.md and its folder, React Native Best Practices needs the command-line tools its instructions call (npx). Our summary lists: Node.js.
Does React Native Best Practices access the network?
SKILL.md names 1 domain. As links in the text: github.com. This is read from the text; nothing was executed.
Is React Native Best Practices safe to install?
Our automated static check of SKILL.md found no risky patterns, such as piping downloads into a shell, reading credential files or hidden Unicode. It is not a guarantee. Review the folder before installing.
What licence does React Native Best Practices use?
React Native Best Practices is published under the MIT licence (declared in SKILL.md). It allows redistribution, so the full SKILL.md is shown on this page.
How many tokens does React Native Best Practices use?
About 3.1k tokens (SKILL.md is roughly 12k characters). Agents keep only the skill's name and description in context until a task matches; then they load SKILL.md in full. Its references folder adds about 1.7M tokens, read only when the agent opens those files.
What are the alternatives to React Native Best Practices?
Skills that share tags, products or a category with React Native Best Practices: Argent React Native Optimization (bbplayer-app/BBPlayer, 1.1k stars), Performance (Sidiora-Labs/centra-llm-agents, 115 stars), React Native Best Practices (vercel-labs/openreview, 1.7k stars) and React Native Expert (tech-leads-club/agent-skills, 7k stars). The comparison table on this page puts their stars, adoption, token cost, safety result and licence side by side.
Who maintains React Native Best Practices?
callstackincubator (a GitHub organization, an official publisher) maintains it in callstackincubator/agent-skills, which has 1,663 GitHub stars. The repository holds 12 skills in this directory. The repository was last updated on October 6, 2026.
Source: callstackincubator/agent-skills on GitHub. Facts on this page come from the repository at the commit we read; the author's words are quoted as theirs.