Skip to content

Relay

JavaScript framework for building data-driven React apps using GraphQL.

Stars
19k
Forks
1.9k
Licence
MIT
Language
Rust
Last update
4 days ago
Type
Framework

What it is

Relay is a JavaScript framework for building React apps that load data. You declare what data each component needs using GraphQL, and Relay works out how and when to fetch it. Queries sit next to the views that use them, and Relay combines them into network requests for only the data needed.

  • Build a todo-style app where data loads through colocated GraphQL queries, as in the TodoMVC example
  • Change data on the client and server with GraphQL mutations
  • Show optimistic UI updates while a mutation is still pending
  • Organise a React app so each component declares its own data requirements

Great for

  • React developers who already use GraphQL
  • Teams with large React apps that need consistent data across many components
  • Developers who want fetching handled by the framework rather than hand-written imperative code
  • Apps that need optimistic updates when users change data

Not ideal for

  • Projects that do not use React, since Relay is built for React applications
  • Teams without a GraphQL API, because Relay's queries are written in GraphQL
  • Beginners new to both React and GraphQL, who would face two learning curves at once
Step-by-step guide: how to use RelayInstall, first run, examples, tips and FAQs

How to get it

  1. 1

    Clone and build from source

    You'll need: Yarn (the README example uses yarn; no version is stated)

    Clone the example repository

    git clone https://github.com/relayjs/relay-examples.git

    Enter the TodoMVC example folder

    cd relay-examples/todo

    Install dependencies

    yarn

    Start the dev server

    yarn dev
  2. 2

    Run it

    • Clone the relay-examples repository
    • Change into relay-examples/todo
    • Run yarn to install dependencies
    • Run yarn dev
    • Open http://localhost:5173 in your browser
  3. 3

    Get the most out of it

    • Read the introduction docs at relay.dev to learn how to add Relay to your own project
    • Study the TodoMVC example to see colocated queries and mutations working together
    • Check the community list of production users at relay.dev/users for real-world patterns
    • Review CONTRIBUTING.md if you want to help develop the framework

Downloads

Strengths

  • Components declare their data needs, which keeps data logic next to the views that use it
  • Relay batches queries into efficient network requests, according to the README
  • Mutations support automatic data consistency, optimistic updates and error handling

Trade-offs

  • Relay depends on GraphQL and React, so it cannot be used on its own with other stacks
  • The README is short and points to external docs for most setup and usage detail
  • The metadata lists the primary language as Rust, which does not match a JavaScript framework; this entry follows the README

How it compares

ProjectStarsTypeLevelUpdatedBest for
relay (this)19kFrameworkintermediate4 days agoReact developers who already use GraphQL
apollo-client19.8kLibraryintermediate5 days agoDevelopers building React apps that query a GraphQL API

Stats synced from GitHub. The assessment above was drafted with AI from the project's README on 2026-10-29 and may miss recent changes — check the README before relying on a command. MIT licence: free to use, modify and distribute, including commercially, as long as you keep the copyright notice.