Kako paginiraš v GraphQL: offset proti cursor?

Question

IT Interview Practice · Accepted Answer

Dve strategiji: **na osnovi offseta** (`limit`/`offset`) in **na osnovi kurzorja**. GraphQL nima vgrajene paginacije, a standard skupnosti je specifikacija **Relay Connection**, ki formalizira kurzorsko paginacijo.

## Offset proti cursor

- **Offset** (`items(limit: 10, offset: 20)`) je preprost, a se pri živih podatkih pokvari: če se med paginacijo uporabnika vstavi vrstica, se elementi premaknejo in vidiš podvojitve ali vrzeli. Prav tako postane počasen pri globokih offsetih (baza še vedno pregleda preskočene vrstice).
- **Cursor** kaže na stabilen položaj ("daj mi 10 za tem elementom"). Varen je pri vstavljanju in se dobro skalira na globoke strani, za ceno tega, da ni naključnega "skoka na stran 50".

## Relay connections

Connection ovije seznam v `edges` (vsak s `cursor` in `node`) plus `pageInfo`:

```graphql
type Query {
  posts(first: Int!, after: String): PostConnection!   # first = page size, after = cursor
}

type PostConnection {
  edges: [PostEdge!]!
  pageInfo: PageInfo!
}
type PostEdge {
  cursor: String!        # opaque token for THIS node's position
  node: Post!            # the actual item
}
type PageInfo {
  endCursor: String      # feed this back as 'after' for the next page
  hasNextPage: Boolean!  # so the client knows when to stop
}
```

```js
// resolver: fetch ONE extra row to compute hasNextPage cheaply
const rows = await db.posts.find({ after: args.after, limit: args.first + 1 });
const hasNextPage = rows.length > args.first;
const page = rows.slice(0, args.first);
return {
  edges: page.map((p) => ({ node: p, cursor: encodeCursor(p.id) })),
  pageInfo: { endCursor: page.at(-1) && encodeCursor(page.at(-1).id), hasNextPage },
};
```

Kurzor je **neprozoren** — običajno base64 ključa za razvrščanje — tako da ga odjemalci obravnavajo kot žeton, ne kot številko.

## Zakaj je to pomembno

Izbira med offset in cursor kaže, da razumeš **konsistentnost pri sočasnih pisanjih** in **zmogljivost pri globokih straneh**. Poznavanje oblike Relay connection je pomembno, ker imajo odjemalci Apollo/Relay zanjo vgrajeno obravnavo predpomnilnika.

Offset proti cursor

Relay connections

Zakaj je to pomembno

Povezana vprašanja