Download for macOS
Skill

relay-best-practices

@facebook Updated 2026-09-11

Best practices for writing idiomatic Relay code. ALWAYS use this skill when writing or modifying React components that use Relay for data fetching. Covers fragments, queries, mutations, pagination, and common anti-patterns. Use when you see `useFragment`, `useLazyLoadQuery`, `usePreloadedQuery`, `useMutation`, `usePaginationFragment`, `graphql` template literals, `react-relay` imports, or `__generated__/*.graphql` files. Also use when asked to explain Relay concepts, debug Relay issues, or review Relay code.

Install

git clone https://github.com/facebook/relay /tmp/relay && ln -s /tmp/relay/skills/relay-best-practices ~/.claude/skills/relay-best-practices

From README

Relay Best Practices Relay is a GraphQL client for React that enforces colocated, composable, and type-safe data fetching. Its core insight is that each component should declare exactly what data it needs via GraphQL fragments, and Relay handles the rest — fetching, caching, consistency, and updates. This skill provides opinionated guidance on which patterns to prefer. For detailed API documentation, read the relevant page from the doc map below. Documentation Relay ships LLM-friendly docs in nodemodules/relay-runtime/llm-docs/ (available after v20.1.1). For older versions, fetch the same files from https://raw.githubusercontent.com/facebook/relay/main/website/docs/. Paths below are relative to this directory ( /). Read the relevant page before writing Relay code.