What's the difference between "Normal Reload", "Hard Reload", and "Empty Cache and Hard Reload" in Chrome?

Google ChromeGoogle Chrome-DevtoolsBrowser Cache

Google Chrome Problem Overview


I recently discovered this new feature in Chrome:

reload options

I can figure out the difference between option 1 and option 3, and that option 2 is probably something in between, but I can't find any more precise information anywhere.

Anybody know the precise behavior of each of the 3 options?

Google Chrome Solutions


Solution 1 - Google Chrome

Normal reload

The same thing as pressing F5. This will use the cache but revalidate everything during page load, looking for "304 Not Modified" responses. If the browser can avoid re-downloading cached JavaScript files, images, text files, etc. then it will.


Hard reload

Don't use anything in the cache when making the request. (which is equal to SHIFT+F5 No need to open Developer console) Force the browser do re-download every JavaScript file, image, text file, etc.


Empty Cache and Hard Reload

Obviously, if the cache is empty then it will have to do a hard reload. This will again force the browser to re-download everything. However, if the page makes any after-the-fact downloads via JavaScript that weren't part of page load, then these might still use the cache, which is where emptying the cache helps because it makes sure that even these won't use cached files.


Note: This feature is only available when the developer tools are open.

Solution 2 - Google Chrome

This also works in Mac OS X. Open developer tools, and then, on the reload button, either

  1. secondary click (right click for right-handed mouse), or
  2. long click, aka long press to see the menu.

In addition to this answer, hard reload often causes proxies, content delivery networks and other remote caches to be refreshed.

enter image description here

Solution 3 - Google Chrome

The following method let you clear cache only for the troubled URL. It helped me when I was stuck with http to https redirection cache.

  1. Open Chrome developer tools, in Windows I use F12
  2. Check Preserve log to save the log before redirection
  3. Right click the redirected URL and Clear browser cache

This will clear only the troubled cache without affecting normal cache.

Solution 4 - Google Chrome

Here's a reference to the spec - the browser performs one of these actions when a reload is triggered:

A 'normal reload' performs either a 'Specific end-to-end revalidation' or 'Unspecified end-to-end revalidation', as defined by the HTTP spec, i.e. cache is used, but revalidation occurs, either with a cache-validating conditional ('specific') or none ('unspecified'). In both cases, the revalidation occurs since max-age header is set to 0 by the browser.

A 'hard reload', on the other hand, seems to trigger an 'End-to-end reload' - no cached copies are allowed to be used. In this case, reload is forced by the browser setting Pragma: no-cache.

Attributions

All content for this solution is sourced from the original question on Stackoverflow.

The content on this page is licensed under the Attribution-ShareAlike 4.0 International (CC BY-SA 4.0) license.

Content TypeOriginal AuthorOriginal Content on Stackoverflow
QuestionSamuel RossilleView Question on Stackoverflow
Solution 1 - Google ChromeAndrew RasmussenView Answer on Stackoverflow
Solution 2 - Google ChromedcorkingView Answer on Stackoverflow
Solution 3 - Google ChromeSohail AhmedView Answer on Stackoverflow
Solution 4 - Google ChromeJoel HView Answer on Stackoverflow