Why Expiration-based caching in Rest API? - Purpose & Use Cases

The Big Idea

What if your app could serve fresh data instantly without asking the server every time?

The Scenario

Imagine you have a website that shows weather data. Every time someone visits, your server asks a weather service for fresh data. If many people visit at once, your server gets overwhelmed making the same request repeatedly.

The Problem

Manually asking for fresh data every time is slow and wastes resources. It can cause delays for users and overload the server. Also, if you try to store data yourself without rules, you might show old or wrong information.

The Solution

Expiration-based caching stores data temporarily and automatically refreshes it after a set time. This way, your server quickly serves stored data to users, reducing repeated requests and keeping data fresh without extra work.

Before vs After

✗ Before

fetchWeather() // called on every user request

✓ After

cache.get('weather') || fetchWeather().then(storeInCacheWithExpiry)

What It Enables

It lets your app serve fast, up-to-date data while saving server power and avoiding overload.

Real Life Example

A news website caches headlines for 10 minutes so visitors get quick responses, but the news still updates regularly without manual checks.

Key Takeaways

Manual repeated data fetching is slow and costly.

Expiration-based caching stores data temporarily with automatic refresh.

This improves speed, reduces server load, and keeps data fresh.

Practice

1. What does the Cache-Control: max-age header do in expiration-based caching?

easy

A. It deletes the cache immediately after the response.

B. It disables caching for the resource.

C. It sets how long the cached data is considered fresh.

D. It forces the client to always fetch new data.

Solution

1. Step 1: Understand the role of Cache-Control header

   The Cache-Control header controls caching behavior for HTTP responses.

2. Step 2: Identify the meaning of max-age directive

   The max-age directive specifies the time in seconds that the response is considered fresh and can be served from cache.

3. Final Answer:

   It sets how long the cached data is considered fresh. -> Option C

4. Quick Check:

   max-age = cache freshness duration [OK]

Hint: Remember max-age sets cache freshness time in seconds [OK]

Common Mistakes:

• Confusing max-age with disabling cache
• Thinking max-age deletes cache immediately
• Assuming max-age forces fresh fetch every time

2. Which of the following is the correct syntax to set a cache expiration of 300 seconds in an HTTP response header?

easy

A. Cache-Control: maxage: 300

B. Cache-Control: max-age=300

C. Cache-Control: expire=300

D. Cache-Control: timeout=300

Solution

1. Step 1: Recall correct Cache-Control syntax

   The Cache-Control header uses directives separated by commas, with max-age specified as max-age=seconds.

2. Step 2: Compare options to correct syntax

   Only Cache-Control: max-age=300 uses the correct format: max-age=300.

3. Final Answer:

   Cache-Control: max-age=300 -> Option B

4. Quick Check:

   Correct header syntax = max-age=seconds [OK]

Hint: Use equal sign (=) with max-age, no spaces [OK]

Common Mistakes:

• Using colon instead of equal sign
• Using incorrect directive names like expire or timeout
• Adding spaces inside the directive

3. Given this HTTP response header:
Cache-Control: max-age=10
What will happen if a client requests the same resource 5 seconds later?

medium

A. The client will use the cached response without contacting the server.

B. The client will ignore the cache and fetch new data from the server.

C. The client will receive a 404 error.

D. The client will refresh the cache but still use old data.

Solution

1. Step 1: Understand max-age meaning

   max-age=10 means the cached data is fresh for 10 seconds after the first fetch.

2. Step 2: Check time elapsed since caching

   5 seconds is less than 10 seconds, so cache is still fresh and valid.

3. Final Answer:

   The client will use the cached response without contacting the server. -> Option A

4. Quick Check:

   Elapsed time < max-age = use cache [OK]

Hint: If request time < max-age, cache is used [OK]

Common Mistakes:

• Assuming cache expires immediately
• Thinking client always fetches new data
• Confusing max-age with cache invalidation

4. You set Cache-Control: max-age=60 but clients still fetch new data every time. What is the likely mistake?

medium

A. The client does not support caching headers.

B. The max-age value should be in milliseconds, not seconds.

C. The resource URL is missing a file extension.

D. The server is sending no-cache header overriding max-age.

Solution

1. Step 1: Check for conflicting headers

   If the server sends a no-cache directive, it forces clients to revalidate or fetch fresh data despite max-age.

2. Step 2: Understand max-age units and client support

   max-age is in seconds, and most clients support caching headers, so these are unlikely causes.

3. Final Answer:

   The server is sending no-cache header overriding max-age. -> Option D

4. Quick Check:

   no-cache overrides max-age [OK]

Hint: Check for no-cache header overriding max-age [OK]

Common Mistakes:

• Confusing seconds with milliseconds for max-age
• Blaming client support without checking headers
• Assuming URL format affects caching

5. You want to cache API responses for 5 minutes but ensure clients always get fresh data after expiration. Which header setup is best?

hard

A. Cache-Control: max-age=300, must-revalidate

B. Cache-Control: max-age=300, no-store

C. Cache-Control: no-cache, max-age=300

D. Cache-Control: max-age=0, public

Solution

1. Step 1: Understand caching for 5 minutes

   max-age=300 sets cache freshness for 300 seconds (5 minutes).

2. Step 2: Ensure fresh data after expiration

   must-revalidate forces clients to check with server after max-age expires before using cached data.

3. Step 3: Evaluate other options

   no-store disables caching, no-cache forces revalidation every time, max-age=0 means no caching.

4. Final Answer:

   Cache-Control: max-age=300, must-revalidate -> Option A

5. Quick Check:

   max-age + must-revalidate = cache then fresh after expiry [OK]

Hint: Use must-revalidate with max-age for fresh data after expiry [OK]

Common Mistakes:

• Using no-store disables caching completely
• Using no-cache forces revalidation every request
• Setting max-age=0 disables caching