← All runbooks
vercel-labs / vercel-react-native-skills

React Native Skills

Apply React Native and Expo best practices for building performant mobile applications. This runbook guides the agent through auditing and improving React Native codebases by applying prioriti

agent claude-codemodel claude-sonnet-4-6snapshot python312-uveval programmatic11 stepsv1.0.0

Deploy React Native Skills to your jetty.io

One-click installs this runbook into a collection on your Jetty account. You can run it from the Spot dashboard, schedule it, or pipe inputs in via the API.

Deploy on jetty.io →View source
The shape of the run

11 steps · start to finish.

  1. 1
    Step 1

    Environment Setup

    ▶

    Verify the environment and locate the React Native project to audit.

    echo "=== Environment Setup ==="

# Verify node is available
node --version || { echo "ERROR: node not found"; exit 1; }
npm --version || { echo "ERROR: npm not found"; exit 1; }

# Create output directory
mkdir -p /app/results

# Verify target directory exists and contains a React Native project
TARGET_DIR="${TARGET_DIR:-$(pwd)}"
if [ ! -f "$TARGET_DIR/package.json" ]; then
  echo "ERROR: No package.json found at $TARGET_DIR"
  exit 1
fi

# Check for React Native dependency
if grep -q "react-native" "$TARGET_DIR/package.json"; then
  echo "PASS: React Native project detected at $TARGET_DIR"
else
  echo "WARNING: react-native not found in package.json — verify this is an RN project"
fi

echo "Setup complete."
  2. 2
    Step 2

    Audit List Performance (CRITICAL)

    ▶

    Apply list performance rules — these have the highest impact on perceived app speed.

  3. 3
    Step 3

    Audit Animation Patterns (HIGH)

    ▶

    Apply animation rules to ensure GPU-accelerated, jank-free animations.

  4. 4
    Step 4

    Audit Navigation (HIGH)

    ▶

    Verify native navigator usage for best performance.

  5. 5
    Step 5

    Audit UI Patterns (HIGH)

    ▶

    Apply UI component best practices.

  6. 6
    Step 6

    Audit State Management (MEDIUM)

    ▶

    Apply state management rules to reduce unnecessary re-renders.

  7. 7
    Step 7

    Audit Rendering (MEDIUM)

    ▶

    Fix rendering anti-patterns that cause runtime warnings or visual glitches.

  8. 8
    Step 8

    Audit Monorepo Configuration (MEDIUM)

    ▶

    For monorepo setups, apply dependency isolation rules.

  9. 9
    Step 9

    Audit Configuration (LOW)

    ▶

    Apply low-impact but good-practice configuration rules.

  10. 10
    Step 10

    Iterate on Errors (max 3 rounds)

    ▶

    If any automated fix caused a build failure or test failure:

  11. 11
    Step 11

    Write Results

    ▶

    Serialize all findings and applied changes to the output files.