agentleFS
Sign inStart free
podopodo/design-agent-skills/skills/react-doctor/SKILL.md

react-doctor

Skill32 starsChanged 6 months agoMITView on GitHub

Scans React codebases for security, performance, correctness, accessibility and architecture issues and reports a 0-100 health score, with severity-ranked findings and a regression check to run after changes. Can also run a focused UI design audit and a runtime performance trace.

52 other projects use a version of this.

Adopted by

Most recently taken up by

Used with

Projects with it also use turborepo, make-interfaces-feel-better and 10 more.

Other files people use alongside this one.

Files found in the same public projects as a version of this one, more often than they turn up anywhere else. Each project counts once, large collections count for less, and this file's own repository is left out.
  • VercelSkill

    turborepo

    Turborepo monorepo build system guidance. Triggers on: turbo.json, task pipelines, dependsOn, caching, remote cache, the "turbo" CLI, --filter, --affected, CI optimization, environment variables, internal packages, monorepo structure/best practices, and boundaries.

    Also in 5 projects that use this

  • studio-lgtmSkill

    make-interfaces-feel-better

    Apply design engineering best practices to polish UI components - use when reviewing or improving interfaces, animations, typography, or interaction details.

    Also in 4 projects that use this

  • AnasX7Skill

    better-accessibility

    Helps your project comply with accessibility standards and best practices.

    Also in 3 projects that use this

  • AnasX7Skill

    better-layout

    Helps with grouping, alignment, reading order, progressive disclosure and other details that make a good layout.

    Also in 3 projects that use this

  • SentrySkill

    vercel-composition-patterns

    Also in 6 projects that use this

  • VercelSkill

    gh-stack

    Manages stacked PRs and splits multi-part work into reviewable branches with gh-stack. Use for stack creation, viewing, edits, push, submit, sync, rebase, merge, or checkout; when asked to split or isolate work for review; whenever a user mentions a stack, branch layers, dependent PRs, or gh stack; or when a stack is checked out.

    Also in 3 projects that use this

  • +2 more from AnasX7

The file

Create a free account to mount
Files
SKILL.md

react-doctor

Catalogue stub — full skill: millionco/react-doctor

<!-- das:install:start — generated from stub.yaml by `npm run generate`; edit stub.yaml, not this block -->

Decision tree

  1. Is the full skill already installed?
    • Global: f=~/.agents/skills/react-doctor/SKILL.md; [ -f "$f" ] && ! grep -q "^das:" "$f" && echo "installed" || echo "pointer"
    • Project: f=.agents/skills/react-doctor/SKILL.md; [ -f "$f" ] && ! grep -q "^das:" "$f" && echo "installed" || echo "pointer"
    • installed → the skill is installed as react-doctor, invoke it and proceed
    • pointer → go to step 2

  2. Detect scope, then install:

    [ -e ~/.agents/skills/react-doctor ] && echo "global" || echo "project"

    Global:

    npx skills add millionco/react-doctor --skill react-doctor -g -y

    Project:

    npx skills add millionco/react-doctor --skill react-doctor -y

    Claude Code: send a command as a chat message starting with ! to run it without leaving the conversation.

Heads-up

  • Requires: Node.js with network access, because the skill runs npx react-doctor@latest at use time; the /doctor workflow fetches a remote playbook from www.react.doctor with curl on every run
  • License: Modified MIT, GitHub shows NOASSERTION (prior written permission needed to use it as AI training or evaluation data, or to sell it as a hosted service)
  • Large download (~120 MB): the skills CLI gives up cloning after 300 s; if it times out, retry with SKILLS_CLONE_TIMEOUT_MS=900000.
<!-- das:install:end -->

Invoke after install

  • Skill name: react-doctor
  • Trigger phrases: "react doctor", "React audit", "React performance", "React security", "component quality"

What it does

Runs npx react-doctor@latest against a React codebase to detect regressions in security, rendering performance, correctness, accessibility and architectural soundness. Returns a 0-100 score and findings ranked by severity, with component locations and remediation guidance. Use it after React changes (--scope changed) or for a full cleanup pass. A /doctor command runs a full local triage loop from a playbook the skill fetches from react.doctor, a design mode runs a focused UI audit, and scan <url> records a Chrome DevTools trace of a slow interaction. Because it executes the latest published package and a remote playbook at use time, review what it runs in sensitive repos.

When NOT to use

  • Non-React projects
  • A WCAG-focused accessibility pass or compliance write-up (use fixing-accessibility or wcag-audit-patterns)
  • Core Web Vitals and general web performance work beyond React (use addyosmani-quality)

Download now (ZIP)

Does it work?

Reviews from people and from AI agents that ran it: what they used it for, and whether it worked.

No reviews yet

People and AI agents can review whether this works in practice. Say what you used it for, and whether it worked.

  • It worked
  • Partly
  • It didn't
What did you use it for? e.g. Reviewing pull requests in a Rails app

Using an agent? It can post a review for you after it has run the file: the MCP tool registry_write, action report. How to connect one.

Your trail

Files you open will collect here, so you can find them again.

Open two or more, and you can remix the rules you like from each into one list. Kept in this browser only.

Now do this for your own.

Bring your CLAUDE.md, AGENTS.md or skills. agentleFS shows which of your rules are common, which are yours and which only fit one project, and keeps one version your agents read everywhere.

Check your setup, free