Kepiye carane paginasi ing GraphQL: offset vs cursor?

Question

IT Interview Practice · Accepted Answer

Rong strategi: **basis offset** (`limit`/`offset`) lan **basis cursor**. GraphQL ora duwe paginasi bawaan, nanging standar komunitas yaiku spesifikasi **Relay Connection**, sing ngresmekake paginasi cursor.

## Offset vs cursor

- **Offset** (`items(limit: 10, offset: 20)`) iku prasaja nanging rusak ing data langsung: yen ana baris disisipake nalika pangguna mbukak kaca, item-e geser lan kowe ndeleng duplikat utawa lompatan. Iki uga dadi alon ing offset sing jero (DB isih nyapu baris sing dilewati).
- **Cursor** nuduhake posisi sing stabil ("wenehi aku 10 sawise item iki"). Iki aman marang penyisipan lan skala tekan kaca jero, kanthi rega ora ana "mlumpat menyang kaca 50" acak.

## Relay connection

Sawijining connection mbungkus daftar ing `edges` (saben duwe `cursor` lan `node`) ditambah `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 },
};
```

Cursor iku **opaque** — biasane base64 saka kunci urut — mula klien nganggep iku minangka token, dudu angka.

## Kenapa iki penting

Milih offset vs cursor nuduhake yen kowe ngerti **konsistensi ing tengah panulisan bebarengan** lan **performa kaca jero**. Ngerti wangun Relay connection iku penting amarga klien Apollo/Relay duwe panganganan cache bawaan kanggo iku.

Offset vs cursor

Relay connection

Kenapa iki penting

Pitakon sing gegandhengan