GraphQL Pagination Considerations
Nov 6, 2020
Paginating data in GraphQL is a trivial operation. The application simply maintains state that it uses to generate a cursor into a target dataset. Easy, right?
Maybe not. When an application provides CRUD operations for a list, things can become complicated. For example,
- Create. When a new entry is appended to a list, pagination should navigate the user to the last page so that they can see this new entry. An example of where this is not implemented is in Google Firebase Console. After you add a new index, Google fails to take you to the last page, which leaves the developer confused.
- Read. In a typical case, the entries displayed on a page are subject to user-selected filtering. When the user changes the filtering, pagination should account for the change in the update to the displayed entries. Simply resetting pagination is not a reasonable solution.
- Update. When an entry in a filtered list is mutated, pagination must account for the effects on displayed entries.
- Delete. When an entry is deleted, pagination must update its information.
Take-away: Pagination must be a first-class design consideration, and not an after-thought; or else you will produce an unsatisfying UX.