react-brain
Browse decisions
React & language foundations 3App architecture 10UI 13Platform & native 9Build, test, observe, secure 6AI in React apps 3stack composerdecision recordscensusstaleness bencharchitecturechangelogmethodologyroadmap

entriesai · verified 2026-08-18 · react + react-native

AI-assisted development — agent skills, MCP tooling & device automation

draftedconfidence: lowearly: 2/14 of this tier graded so far (0 overturned) — the public scorecard →

related decisions: ai-ui · ondevice-ai · testing · dx

cited by: build · dx

re-verified 6× — 2026-08-18 · 2026-08-07 · 2026-07-28 · 2026-07-20 · 2026-07-16 · 2026-07-10 · changelog

recommendation

Give a coding agent two things: RN KNOWLEDGE — a curated skills pack (Callstack agent-skills is the broadest; add Margelo react-native-skills for camera/native depth) — and EYES+HANDS on the running app — Maestro MCP if you already test with Maestro (see RB-E-TESTING), else agent-device (cross-platform) or Argent (iOS debug/profile depth). Add Reactotron MCP when the agent needs runtime state. Fast-moving (confidence: low) — most of these tools are months old; trial on one workflow before standardizing.

  • agent writes RN code → install a skills pack (agent-skills / react-native-skills) so it stops generating stale patterns
  • agent must run and SEE the app (closed verify loop) → agent-device (cross-platform) or Argent (iOS debugger/profiler depth)
  • agent-generated E2E tests → Maestro MCP (owned by RB-E-TESTING)
  • agent needs runtime state / network inspection → Reactotron MCP
  • agent writes WEB frontend code (HTML/CSS/DOM) → modern-web-guidance as a pre-write consult; the RN skill packs above don't cover the web platform
  • agent-driven device work you repeat (QA sweeps, regression flows) → discover the flow once with the model, then agent-device replay it with zero model calls
  • how to WORK with agents (TDD, review discipline, cognitive debt) → agentic-engineering-patterns

Low confidence — fast-moving or lightly-vetted domain: treat the pick as a vetted lead and prototype before committing.

Options & tradeoffs

the field considered — and why each one isn’t the default here

optiontradeoffevidence
agent-skills (Callstack)curated skill packs for coding agents — RN best practices, upgrade playbook, brownfield migration, library scaffolding; installs into Claude Code / Cursor / Codex / Gemini CLI; the broadest pack (~1.5k★)
react-native-skills (Margelo)RN-focused skills (VisionCamera and native-module depth) via `npx skills add margelo/react-native-skills`; younger/smaller than Callstack's
agent-device (Callstack)agent-native CLI: AI agents drive real iOS/Android/tvOS/macOS/web devices & simulators — a11y snapshots, actions, replayable scripts; v0.20.x (0.20.9 on npm and GitHub, verified 2026-08-18), iterating fast — 0.20 redesigned gesture execution, added Maestro compatibility through a typed engine, and shipped REPLAY: save a completed agent-driven flow as a script and re-run it with zero model calls (see reading)115k/wk · ships in 2/34
Argent (Software Mansion)MCP server + skills: simulator control, debugger attach (React tree + JS), console/HTTP monitoring, correlated React+iOS profiling; 0.21.0 (verified vs npm 2026-08-18; 0.17 first) extends beyond iOS — tvOS/Android TV/Vega OS, cloud agents for autonomous bug repro, Argent Lens design review; also listed in RB-E-TESTING45k/wk
Maestro MCP / Maestro Vieweragents drive devices and GENERATE E2E flows on the tool the ecosystem already tests with — see RB-E-TESTING (which owns the testing depth)
Reactotron MCPthe classic RN debugger exposes runtime state/network to coding agents via MCP (reactotron-core-server 3.3.0, 2026-05)320k/wk · ships in 4/34
Expo AI toolingSDK 55+ ships agent-focused tooling (Expo skills at docs.expo.dev/skills, MCP integration) for Claude/Cursor/Codex as part of the framework — THIS is the durable part. Expo Agent, their hosted web app-building agent, is DEAD: closed beta ended, agent.expo.dev goes away after 2026-07-31 (export your projects), with Expo saying it would rather integrate with the harnesses developers already use than build its own IDE
TanStack Intent (ALPHA)a DISTRIBUTION mechanism, not a pack: agent skills ship INSIDE npm packages and are discovered via the node_modules dependency graph, version-pinned with staleness detection; rolling out in TanStack DB first
modern-web-guidance (Google Chrome)the WEB counterpart to the RN skill packs above, and a different shape: not a linter or a codegen tool but a SEARCH INDEX over curated best-practice guides, consulted BEFORE writing HTML/CSS/DOM code — `npx modern-web-guidance search "<action phrase>"` returns ranked hits with ids, the web features used, a tokenCount and a similarity score; `retrieve <id>` returns the guide as markdown. Guides carry Baseline-keyed fallbacks, so "is this safe yet?" becomes a date comparison with the fallback attached. Semantic search runs locally through a small on-device model (no API key, works offline; telemetry to Google is on by default — DISABLE_TELEMETRY=1). Framework-agnostic. 0.0.x, published continuously
Metrognome (Uphold)an AUTONOMOUS performance loop rather than a hands-on-the-device tool: propose a hypothesis → drive the app (it orchestrates agent-device and Callstack's profiling tooling rather than shipping its own) → measure N times → keep the change only if it beats the noise, else revert; accepted fixes land as separate commits carrying their before/after numbers, and every experiment (kept OR rejected) appends to a performance-memory file committed in the repo so the next run doesn't re-test a dead end. npm `metrognome` 0.2.6 (2026-08-08, github.com/uphold/metrognome) — early, and the strongest idea in it is the gate, not the automation
React Native Evals (Callstack)open-source benchmark suite for WHICH MODEL writes good RN code — task dataset by category/library, TS+Bun runner, judge + methodology whitepaper; the model-selection layer under all the tools above
ReactBench (Million)WHICH MODEL writes good REACT-WEB code — Write React / Fix React tasks from real merged PRs, graded by behavioral tests + react-doctor's 400+ deterministic rules (see RB-E-DX) in clean-room containers; public leaderboard (2026-07: GPT 5.6 Terramax/Solmax 53%, Fable 5xhigh 46% Pass@1); the web counterpart to RN Evals

evidence: npm weekly downloads (signals snapshot) · “ships in n/D” = adoption across the production-app census, honest denominators

npm weekly downloads (from the corpus's last signals run): agent-device 115k · reactotron-react-native 320k · @swmansion/argent 45k

Verified notes

NEW entry (2026-07-09): the dominant recurring theme of Native Weekly issues 11–16 (Jan–Jun 2026) — every single issue shipped agent-tooling news (agent-device ×3, two skills packs, Reactotron MCP, Argent, Expo SDK 55/56 AI tooling, Xcode 26.3 'agentic coding') — and the corpus had no home for the SELECTION question 'which agent tooling for RN development'. Distinct from RB-E-AI-UI (AI in the product) and RB-E-ONDEVICE-AI (models on device): this is AI at DEV time. Device-driving TESTING tools (Maestro MCP, Argent, Radon IDE) stay owned by RB-E-TESTING; this entry is the cross-tool map. All options fetch-verified 2026-07-09 (GitHub repos, npm, SWM blog). Everything here is pre-1.0-culture — pin versions, expect churn. FIRST CASUALTY (2026-07-28, verified vs the Expo changelog): Expo Agent — carried here since 2026-07-09 as "waitlist beta … track, don't bet" — was wound down on 2026-07-20, five weeks after this entry first listed it; the hosted agent at agent.expo.dev stops working after 2026-07-31. Expo's stated reasoning is the useful signal, not the shutdown: rather than build a web-based harness and IDE, integrate with the harnesses developers already customize deeply. That is the shape of this whole category — the SKILLS/MCP layer (portable, rides whatever harness you use) outlives the hosted-product layer. Weight option rows accordingly. THE WEB SIDE WAS MISSING UNTIL 2026-08-18: every skills-pack row here was React Native (Callstack, Margelo, Expo), which quietly implied the corpus had no answer for "my agent writes stale web frontend code". Google Chrome's modern-web-guidance fills it, and its shape is worth copying: a searchable index of current guidance with Baseline-keyed fallbacks, consulted before writing — not a linter run afterwards. It also draws the boundary this category keeps blurring: a skill supplies the STANDARD, something else (you or the agent) still has to read the code. BENCHMARK LAYER (2026-08-07, verified vs appcontrolbench.swmansion.com): SWM Labs' AppControlBench compares agent-tool × model configurations (Argent and agent-device — the two device-driving options this entry tracks — against Claude/GPT lines) on real iOS app-control tasks: ~120 configs with completion/time/cost leaderboards (best on record 2026-08-03: 98% completion at $0.22/run, Claude Haiku + Argent 0.15). The selection question this entry owns now has a live first-party leaderboard — check it before pinning a tool+model pair.

Canonical reading

Editorial annotations on why each piece matters — the articles themselves are the originals; read them there.

3 Minutes With an Agent, 9 Seconds on ReplayMichał Pierzchala (Callstack)

Measures where the time actually goes when an agent drives a device, and the answer is: not on the device. A nine-action QA task on an Android emulator took the agent 3m18s; saved as a replayable script and re-run with `agent-device replay` it finished in 8.8 seconds INCLUDING app launch, with zero model calls. Taps and snapshots were thin slices of the original run — the ~190-second gap is model inference, API round trips, screen reading and deciding what to do next. Two numbers make it actionable: in the opening run 2 of 29 tool calls were help lookups or rejected commands, and across an audit of 108 spontaneous runs 375 of 2,668 calls (14.1%) never reached the device at all. So the design rule for agent-driven device work is to spend model turns on DISCOVERING a flow once, then replay it deterministically for every repeat — the same split that makes recorded E2E cheap. Stated caveats: simulators/emulators on a workstation (no physical devices), load-gated timings for one experiment only, small + mid-tier models of one provider.

Testing Google's modern-web-guidance skill against a real React appAlfy

An independent field test of the option row above, and the honest scoping this category usually lacks. Pointed at a real Vite + React questionnaire app (42 files) it correctly flagged a hardcoded light theme with no color-scheme/prefers-color-scheme, data-entry surfaces with zero <form> elements, validation predating :user-invalid, and min-height:100vh where 100dvh is the modern answer — each with Baseline-checked, copy-pasteable guidance, and it also explicitly endorsed what the app already had right (fieldset/legend, role=alert, :focus-visible). The limits are the useful part: THE SKILL DOES NOT READ YOUR CODE — a human or an agent must inventory the codebase, turn each suspicion into a search phrase and compare the answer back to the actual lines; semantic search has a recall ceiling (dark-mode hit 0.75, but the dvh answer never surfaced as its own result, only inside broad omnibus guides); guides are large (forms ~4,500 tokens, accessibility ~7,100, both reported up front so you can weigh the fetch); and it returns general rules that may not apply — most of the input-attribute advice was irrelevant to a radio-driven form, and noticing that is the human's job. The author's reframe is the durable one: it is less a tool you run than a standard you consult, best used the moment BEFORE writing a component, when the model in the loop (human or AI) is about to reach for the pattern it already knows.

Bun is being rewritten in RustJarred Sumner (Bun)

The largest published agent-driven port to date, and the methodology reading for agent fleets: Bun v1.4 ships a Zig→Rust rewrite of 535,496 lines executed by ~64 parallel Claude agents across 4 worktrees in ~50 workflows over 11 days (2026-05), ~$165k in API cost vs an estimated blocked engineer-year — with the load-bearing discipline that each implementer agent was paired with TWO adversarial reviewers in separate context windows told to assume the code was wrong. Results: every instrumentable memory leak resolved (one bundler workload: 609MB stable vs 6.7GB before), ~20% smaller binaries, 2–5% faster. Not RN-specific, but the concrete data point for what adversarially-reviewed agent fleets can do to a production codebase — the review-pairing pattern transfers to any repo using the tools in this entry.

How Expensify Uses Agent-Device for Mobile Bug Evidence and ProfilingCallstack (with Expensify)

The first named production-adopter case study for agent-device: agents run Sentry-span measurement loops across branches and drive the React profiler mid-session via react-devtools integration, returning named components and render counts as bug evidence. What agent-in-the-debug-loop looks like at a real company, beyond vendor demos.

Metrognome — An AI Agent for Measured React Native Performance FixesCallstack

The layer ABOVE the device-drivers in this entry: not another profiler or benchmark, but a loop that decides what to keep. For a given performance goal it proposes one hypothesis, runs the experiment, measures it N times on a live app, keeps the change only if it beats the noise, commits it with the evidence, then picks the next hypothesis — one variable at a time. It ships no profiler and no device driver of its own; it orchestrates the tools already listed here (Agent Device for eyes and hands, Agent React DevTools, and the rest of Callstack's stack) and contributes the research loop plus memory. VENDOR POST — nearly every organ carries a Callstack logo, and the numbers are theirs. The durable, transferable part is the discipline: an optimization agent that can REJECT its own work against a noise floor is a different thing from one that reports a diff.

Meet Argent: Agentic Toolkit to Control, Debug and Profile iOS applicationsKacper Kapuściak (Software Mansion)

The clearest articulation of the closed loop this entry is about: the agent that writes the code also boots the simulator, drives the UI, attaches a debugger, and profiles React+iOS in the same session — with production numbers (~50% re-render reduction in a banking app) rather than demos.

Fable 5 vs GPT-5.6 Sol: I spent $2,000 and 2 billion tokens to find out who winsRami Maalouf (Expo)

First-party measured model comparison on real Expo apps: three models (Fable 5/Claude Code, GPT-5.6 Sol/Codex, GPT-5.5 control) each one-shot three apps end-to-end — ideation, per-feature on-simulator validation, debugging — under the same spec-driven prompt and template. Fable 5 won code + UI quality (code-health 88 vs 79/79) at ~3× the hourly cost ($74/h vs ~$30/h) and ~30% less wall-clock; the dominant token cost across all models was the simulator-validation loop, not generation. The model numbers are point-in-time (2026-08-05); the durable part is the harness — standing quality bars plus per-feature simulator validation is what made one-shot apps work at all. (Fetched via browser-UA curl; expo.dev/blog no longer blocks it.)

Sources

Depth (in-domain rules) is owned by the agentic-engineering-patterns skill — this entry is selection breadth.

Related in ai: ondevice-ai · ai-ui