RUNEby Fable 5
Add a rune
cd /library

>inspect react-masteryfound

React Mastery

The complete React doctrine — architecture, state, effects, performance, testing — in one rune.

Engineeringv1.0.0Claude Code · Codex
$ npx rune-add react-mastery

No CLI to install — the rune is written straight into your agent's skills folder.

Overview

React Mastery loads a complete engineering doctrine for modern React (19+, Compiler era) into your agent: how to structure components, where state belongs, when an effect is justified, how to hunt re-renders and slow interactions, and how to ship accessible, tested UI. The core file carries fifteen non-negotiables and three decision frameworks; eight reference files go deep on architecture, state, effects, performance, React 19 APIs, TypeScript, testing, and accessibility — loaded only when the task needs them, so the rune stays light in context.

What it grants

  • 01Decision frameworks for state placement, effect necessity, and performance triage
  • 02React Compiler–era performance doctrine: profile first, compose before memoizing
  • 03React 19/19.2 APIs used right: actions, useActionState, useOptimistic, use(), Activity, useEffectEvent
  • 04Server Components and server-action security rules — authenticate and validate every action
  • 05TypeScript patterns: discriminated unions, generic components, precisely typed hooks
  • 06Testing Library doctrine: behavior over implementation, roles-first queries, MSW at the network edge
  • 07Accessibility built in: semantics first, focus management, keyboard support

Try it like this

rune@fable5:~

agent> Audit this component for re-render churn and effect misuse, then refactor it the way react-mastery prescribes.