Get the latest insights, best practices, and tips from power users

Hygraph
Docs

Pagination

#Paginate query results

Hygraph supports various arguments for paginating content entries:

ArgumentTypeDefinition
firstIntSeek forwards from start of result set.
lastIntSeek backwards from end of result set.
skipIntSkip result set by given amount.
beforeStringSeek backwards before specific ID.
afterStringSeeks forwards after specific ID.

#Pagination limits

To fetch the pagination limits of your projects, you need to access the API Playground section of your Hygraph project, select Management API from the Environment dropdown located at the top of the screen, and run the following query:

{
viewer {
project(id: "<PROJECTID>") {
defaultPaginationSize
maxPaginationSize
}
}
}

#Nested pagination

You can also use first, last, skip, before, and after arguments with any nested relations. For example, let's imagine our post has comments:

{
posts {
id
comments(first: 6, skip: 6) {
id
createdAt
}
}
}

#Relay cursor connections

Hygraph follows the Relay cursor connection specification. Each of your project models also contain a connection type, automatically managed by Hygraph.

The example below shows us how we can query for the first 3 posts, after the cursor (ID) abc. We can also query pageInfo to check whether there are more pages using hasNextPage.

The PageInfo is useful when paginating.

{
postsConnection(first: 3, after: "abc") {
edges {
cursor
node {
id
title
}
}
pageInfo {
hasNextPage
hasPreviousPage
startCursor
endCursor
pageSize
}
}
}

Learn more about fetching with Relay.