1

When I open the dev tool and select Disable Cache, chrome adds Cache-Control: no-cache in request header for all requests.

But if I press ctrl + F5 or click on Empty Cache and hard reload button in chrome, I noticed that for some requests, chrome does not add Cache-Control: no-cache in request header.

How does chrome determine which request to add the header?

Example issue I'm having with 2 requests:

Initial conditions (normal load)

  • Request 1 & 2 (request headers): no Cache-Control
  • Response 1 & 2 (response headers): Cache-Control: public,max-age=3600 → both are cached
Scenario Request 1 — Request Header Response 1 — Result Request 2 — Request Header Response 2 — Result
Baseline (normal load) (none) 200 from server; cached (max-age=3600) (none) 200 from server; cached (max-age=3600)
Scenario 1: Hard reload (Ctrl+F5) Cache-Control: no-cache (added by browser?) Refetched from server (none why??) Loaded from disk cache
Scenario 2: Empty cache + hard reload Cache-Control: no-cache (added by browser?) Refetched from server (none why??) Refetched from server

So I'm very confused why browser only add Cache-Control: no-cache in request 1's header but not request 2 when I ctrlF5 or Empty cache and hard reload?

Improve this question
1
  • You seem mistaken. Chrome does not add Cache-Control: no-cache when "Disable Cache" is checked up. Commented Aug 14 at 4:51

1 Answer 1

Reset to default
0

When you check "Disable cache" in Chrome DevTools, Chrome does not literally add Cache-Control: no-cache to the request headers for every request. Instead, it completely bypasses the HTTP cache at the browser level; the request is sent to the network stack as if no cached entry exists at all.

When you do a hard reload (Ctrl + F5), that’s when Chrome will often add Cache-Control: no-cache and Pragma: no-cache, but only for requests that could otherwise be served from cache.
That header is a signal to the server to say “I have a cached copy, but I want you to revalidate it anyway.”

So how Chrome decides is as follows:

  1. Disable cache (DevTools) -> Add Cache-Control: no-cache to all requests, no questions asked.

  2. Hard reload (Ctrl + F5) -> Add Cache-Control: no-cache only if the cached entry is still valid or revalidation is optional. If the entry is already expired, has no-store, or has been deleted, no no-cache header is sent.

  3. Empty cache + hard reload -> Cache is gone -> No need for Cache-Control: no-cache for some resources.

Improve this answer
Sign up to request clarification or add additional context in comments.

1 Comment

Hi Siya, thanks for the explanation. I have edited my post to include some examples. Could you have a look when you have time? I'm still very confused why browser treat the 2 requests differently.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.