HTTP Caching — How does it work step by step?

  • clients (in our context, browsers),
  • proxy servers, and
  • origin servers

Two-players: browser and origin server

Cache-Control from the server

  • no-store prohibits the browser store any cache. It is useful for continually changing sources.
  • no-cache has a misleading name. It actually allows cache, but validation with the origin server is mandatory before using it.
  • max-age helps our browser decide if a resource is considered fresh.
  • must-revalidate instructs the browser to validate a resource on the origin server when it is stale. It usually uses with max-age.

Cache-Control from the browser

Conditional requests from the browser


  1. The browser requests a resource for the first time.
  2. The server response includes a Last-Modified header.
  3. When the browser requests the resource again, it attaches the If-Modified-Since header automatically.
  4. The server validates the time and notices no modifications.
  5. Since there is no modification, the server responds with a 304 status code and other headers, telling the browser to use cache.
  6. When seeing 304, the browser knows it is safe to use cache.


  1. The browser sends the first request.
  2. The server responds with the resources. An ETag header is added to the response.
  3. When the browser requests the same resource, an If-None-Match header is attached, along with ETag's value received in the previous response.
  4. The server validates the ETag and detects if the resource has been modified.
  5. If the resource remains the same, the server sends a 304 status code response with other headers.
  6. The browser knows that it is safe to use its cache.
# Strong ETag
# Weak ETag

Three-players: Browser, proxy server, and origin server

Cache-Control from the origin server

Cache-Control from the browser

  • max-age=10
  • max-stale=10
  • max-age=10
  • min-fresh=5

Let’s put everything together

Further reading




a coder 🧑🏻‍💻

Love podcasts or audiobooks? Learn on the go with our new app.

Recommended from Medium

Research Summary: WIP: Finding Bugs Automatically in Smart Contracts with Parameterized Invariants

From zero to published

Difference between ‘compose’ and ‘andThen’ Function interface methods in Java

How did I manage to get my first Full-Stack Developer job without a degree.

2.5D Platformer — #3 Double Jump Ability

The Power Of GIT!

Introduction Clippy

The simple structure and one active help channel

Building a reproducible CI system for fun and profit

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store


a coder 🧑🏻‍💻

More from Medium


History Integration Issues with git Commits

Did I really just commit and push a file with a password in it?-Remove

The differences between static and dynamic libraries