Jak cachować API GraphQL?

Question

IT Interview Practice · Accepted Answer

Cachowanie GraphQL jest trudniejsze niż REST, ponieważ jest jeden endpoint, a żądania to zwykle POST, więc cachowanie HTTP oparte na URL nie działa od razu. Zamiast tego cachujesz na trzech warstwach: **klient**, **transport/CDN** oraz **serwer**.

## Znormalizowany cache klienta

Apollo Client i Relay przechowują wyniki w **znormalizowanym cache** kluczowanym przez `__typename` + `id`. Każdy obiekt jest przechowywany raz; różne zapytania odwołujące się do tego samego `User:1` współdzielą go, więc mutacja aktualizująca jedną encję automatycznie odświeża każdy widok.

```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
```

Właśnie dlatego pola powinny zwracać `id` — cache potrzebuje stabilnego klucza do deduplikacji.

## Persisted queries + CDN

**Persisted queries** zastępują tekst zapytania hashem. Klient wysyła krótki hash zamiast długiej treści POST; serwer wyszukuje zarejestrowane zapytanie.

```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
```

Zamiana zapytań odczytu w cachowalne GET-y pozwala **CDN** serwować je na brzegu sieci i zmniejsza rozmiar payloadu. Wskazówki `@cacheControl` (max-age, scope) pozwalają serwerowi zadeklarować TTL per pole, których CDN i cache serwera Apollo przestrzegają.

## Po stronie serwera

Cache odpowiedzi (np. Apollo) kluczowany przez zapytanie + zmienne + scope autoryzacji pozwala uniknąć ponownego uruchamiania resolverów; DataLoader obsługuje deduplikację w obrębie żądania (to inna kwestia — nie jest to cache międzyżądaniowy).

## Dlaczego to ważne

Projekt z jednym endpointem/POST psuje naiwne cachowanie HTTP, więc rekruterzy chcą usłyszeć **warstwową** odpowiedź: znormalizowany cache encji na kliencie, persisted queries + `@cacheControl`, aby odblokować cachowanie CDN/edge, oraz to, gdzie pasuje DataLoader (per żądanie, nie międzyżądaniowo).

Znormalizowany cache klienta

Persisted queries + CDN

Po stronie serwera

Dlaczego to ważne

Powiązane pytania