Wie cachest du eine GraphQL-API?

Question

IT Interview Practice · Accepted Answer

GraphQL zu cachen ist schwieriger als REST, weil es einen Endpunkt gibt und Anfragen meist POST sind, sodass URL-basiertes HTTP-Caching nicht out of the box funktioniert. Stattdessen cachest du auf drei Ebenen: **Client**, **Transport/CDN** und **Server**.

## Normalisierter Client-Cache

Apollo Client und Relay speichern Ergebnisse in einem **normalisierten Cache**, indiziert nach `__typename` + `id`. Jedes Objekt wird einmal gespeichert; verschiedene Abfragen, die denselben `User:1` referenzieren, teilen ihn sich, sodass eine Mutation, die eine Entität aktualisiert, automatisch jede Ansicht aktualisiert.

```graphql
# Both queries write to the same normalized entry User:1 in the client cache
query A { user(id: "1") { id name } }
query B { post(id: "9") { author { id name } } }  # author is also User:1
```

Deshalb sollten Felder `id` zurückgeben – der Cache braucht einen stabilen Key zur Deduplizierung.

## Persisted Queries + CDN

**Persisted Queries** ersetzen den Query-String durch einen Hash. Der Client sendet einen kurzen Hash statt eines langen POST-Bodys; der Server schlägt die registrierte Abfrage nach.

```js
// Automatic Persisted Queries: first a tiny GET with just the hash
// GET /graphql?extensions={"persistedQuery":{"sha256Hash":"abc..."}}
// -> because it's a GET with a stable key, a CDN can cache the RESPONSE at the edge
```

Read-Queries in cachebare GETs zu verwandeln, lässt ein **CDN** sie am Edge ausliefern und verkleinert die Payloads. `@cacheControl`-Hinweise (max-age, scope) lassen den Server pro Feld TTLs deklarieren, die das CDN und der Apollo-Server-Cache respektieren.

## Serverseitig

Ein Response-Cache (z. B. der von Apollo), indiziert nach Abfrage + Variablen + Auth-Scope, vermeidet das erneute Ausführen von Resolvern; DataLoader übernimmt die Deduplizierung pro Anfrage (ein anderes Anliegen – es ist kein anfrageübergreifender Cache).

## Warum es wichtig ist

Das Design mit einem Endpunkt/POST bricht naives HTTP-Caching, deshalb wollen Interviewer die **mehrschichtige** Antwort hören: normalisierter Entitäts-Cache auf dem Client, Persisted Queries + `@cacheControl`, um CDN-/Edge-Caching freizuschalten, und wo DataLoader hineinpasst (pro Anfrage, nicht anfrageübergreifend).

Normalisierter Client-Cache

Persisted Queries + CDN

Serverseitig

Warum es wichtig ist

Ähnliche Fragen