React Patterns

Source: React Documentation — Official React mental model

Philosophy: Generic principles, informed by anti-patterns we've seen in this codebase. Timeless rules, not line-number references.

The Golden Rule

Write idiomatic React. Respect the component lifecycle (mount → update → unmount), keep renders pure, and use hooks correctly (useEffect, useCallback, useRef, useMemo).

React will call your component multiple times, in any order, at any time. Code that works "by accident" will break unpredictably.

When to Use This Skill

• Writing or reviewing React components
• Fixing lint errors related to hooks or purity
• Deciding where to put logic (render vs effect vs handler)

Key Principles