Skip to content

docs: cursor-based pagination guide #4391

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
wants to merge 1 commit into
base: 16.x.x
Choose a base branch
from

Conversation

sarahxsanders
Copy link
Contributor

Adds a guide on cursor-based pagination

---

When a GraphQL API returns a list of data, pagination helps avoid
fetching too must data at once. Cursor-based pagination fetches items
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Suggested change
fetching too must data at once. Cursor-based pagination fetches items
fetching too much data at once. Cursor-based pagination fetches items


GraphQL.js doesn't include cursor pagination out of the box, but you can implement
it using custom types and resolvers. This guide shows how to build a paginated field
using the connection pattern popularized by Relay. By the end of this guide, you will
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Let's link to relay here

name: 'PageInfo',
fields: {
hasNextPage: { type: new GraphQLNonNull(GraphQLBoolean) },
endCursor: { type: GraphQLString },
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

We are missing startCursor and hasPreviousPage which are mandatory in Relay, no?

4. Build the `edges` and `pageInfo` objects.

The exact logic will vary depending on how your data is stored. The following example uses an
in-memory list of users. The same logic applies to database queries with indexed data.
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Should we add a more real life scenario i.e. how to do this in sql.

  • requesting first or after + 1
  • deriving pageInfo
  • translating cursor/... to offset

I guess it could be a lot of code for docs here but might be a useful recipe

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

2 participants