Bird
Raised Fist0
GraphQLquery~5 mins

Response caching strategies in GraphQL

Choose your learning style10 modes available

Start learning this pattern below

Jump into concepts and practice - no test required

or
Recommended
Test this pattern10 questions across easy, medium, and hard to know if this pattern is strong
Introduction

Response caching helps save time by storing answers to repeated questions. This means faster replies and less work for the server.

When many users ask the same question often, like fetching popular product details.
When data changes slowly, so cached answers stay useful for a while.
When you want to reduce server load during busy times.
When you want to improve user experience by giving quick responses.
When you want to save bandwidth by not sending the same data repeatedly.
Syntax
GraphQL
type Query {
  book(id: ID!): Book @cacheControl(maxAge: 60)
}

# or using HTTP headers for caching
# Cache-Control: max-age=60
Use @cacheControl(maxAge: seconds) directive in GraphQL schema to set caching time.
HTTP headers like Cache-Control can also control caching behavior.
Examples
This caches the user query response for 120 seconds.
GraphQL
type Query {
  user(id: ID!): User @cacheControl(maxAge: 120)
}
This caches the latest news for 30 seconds, good for frequently updated data.
GraphQL
type Query {
  latestNews: [News] @cacheControl(maxAge: 30)
}
This HTTP header tells the client to cache the response for 5 minutes.
GraphQL
# HTTP header example
Cache-Control: max-age=300
Sample Program

This GraphQL query asks for popular books. The @cacheControl(maxAge: 60) directive caches the response for 60 seconds, so repeated requests within that time get faster answers.

GraphQL
type Query {
  popularBooks: [Book] @cacheControl(maxAge: 60)
}

# Query
{
  popularBooks {
    title
    author
  }
}
OutputSuccess
Important Notes

Cache duration should match how often data changes to avoid showing old info.

Use caching carefully for sensitive or user-specific data to avoid leaks.

Combining server-side and client-side caching can improve performance.

Summary

Response caching stores answers to speed up repeated requests.

Use @cacheControl directive or HTTP headers to set caching time.

Choose caching times based on how fresh your data needs to be.

Practice

(1/5)
1. What is the main purpose of response caching in GraphQL?
easy
A. To store query results and speed up repeated requests
B. To encrypt data sent between client and server
C. To validate user permissions for queries
D. To log all queries for debugging

Solution

  1. Step 1: Understand response caching concept

    Response caching saves the answers of queries so that if the same query is asked again, the server can quickly return the saved answer instead of recalculating it.
  2. Step 2: Identify the main benefit

    This speeds up repeated requests and reduces server load.
  3. Final Answer:

    To store query results and speed up repeated requests -> Option A
  4. Quick Check:

    Response caching = store and speed up [OK]
Hint: Caching saves answers to reuse later, speeding up requests [OK]
Common Mistakes:
  • Confusing caching with encryption
  • Thinking caching controls permissions
  • Believing caching logs queries
2. Which of the following is the correct way to set a cache duration using the @cacheControl directive in GraphQL SDL?
easy
A. @cacheControl(duration: 60)
B. @cacheControl(maxAge: 60)
C. @cacheControl(cacheTime: 60)
D. @cacheControl(time: 60)

Solution

  1. Step 1: Recall the correct directive syntax

    The @cacheControl directive uses the argument maxAge to specify cache duration in seconds.
  2. Step 2: Match the correct argument name

    Only maxAge is valid; other argument names like duration, cacheTime, or time are incorrect.
  3. Final Answer:

    @cacheControl(maxAge: 60) -> Option B
  4. Quick Check:

    @cacheControl uses maxAge [OK]
Hint: Use maxAge to set cache seconds in @cacheControl [OK]
Common Mistakes:
  • Using wrong argument names like duration or time
  • Omitting the argument name
  • Using invalid directive syntax
3. Given this GraphQL query with caching set to @cacheControl(maxAge: 120), what happens if the same query is requested twice within 2 minutes?
medium
A. The server returns the cached response on the second request
B. The server returns an error on the second request
C. The server recalculates the response both times
D. The cache is ignored and data is fetched fresh every time

Solution

  1. Step 1: Understand maxAge meaning

    The maxAge: 120 means the response is cached for 120 seconds (2 minutes).
  2. Step 2: Analyze repeated request timing

    If the second request happens within 2 minutes, the cached response is still valid and returned immediately.
  3. Final Answer:

    The server returns the cached response on the second request -> Option A
  4. Quick Check:

    maxAge 120 means cache valid 2 minutes [OK]
Hint: Within maxAge, cached response is reused [OK]
Common Mistakes:
  • Thinking cache expires immediately
  • Assuming server errors on repeated queries
  • Believing cache is ignored always
4. You set @cacheControl(maxAge: -10) on a field. What is the likely problem?
medium
A. Negative maxAge causes a syntax error
B. Negative maxAge disables caching for that field
C. Negative maxAge is treated as zero, caching forever
D. Negative maxAge causes cache to expire immediately

Solution

  1. Step 1: Understand maxAge value meaning

    maxAge defines how long the response is cached in seconds. Negative values are invalid for duration.
  2. Step 2: Interpret negative maxAge effect

    Negative maxAge is treated as cache expired immediately, so no caching occurs effectively.
  3. Final Answer:

    Negative maxAge causes cache to expire immediately -> Option D
  4. Quick Check:

    Negative maxAge means cache expires instantly [OK]
Hint: Negative maxAge means cache expires right away [OK]
Common Mistakes:
  • Expecting syntax error from negative value
  • Thinking negative disables caching explicitly
  • Assuming negative means cache forever
5. You want to cache a GraphQL query response for a user profile that updates frequently but not every second. Which caching strategy is best?
hard
A. Set @cacheControl(maxAge: 5) to cache for 5 seconds
B. Set @cacheControl(maxAge: 3600) to cache for 1 hour
C. Set @cacheControl(maxAge: 300) to cache for 5 minutes
D. Do not use caching to always get fresh data

Solution

  1. Step 1: Consider data freshness needs

    User profiles update frequently but not every second, so caching too long risks stale data.
  2. Step 2: Choose a balanced cache duration

    5 seconds is too short to gain caching benefits; 1 hour is too long risking stale data. 5 minutes (300 seconds) balances freshness and performance.
  3. Final Answer:

    Set @cacheControl(maxAge: 300) to cache for 5 minutes -> Option C
  4. Quick Check:

    Moderate maxAge balances freshness and speed [OK]
Hint: Pick cache time balancing freshness and speed [OK]
Common Mistakes:
  • Choosing too short cache time losing benefits
  • Choosing too long cache time causing stale data
  • Avoiding caching when moderate caching helps