Disabling Chrome cache for website development

by

The Chrome DevTools can disable the cache.

  1. Right-click and choose Inspect Element to open the DevTools. Or use one of the following keyboard shortcuts:
  • F12
  • Control+Shift+i
  • Command+Shift+i
  1. Click Network in the toolbar to open the network pane.
  2. Check the Disable cache checkbox at the top.

screenshot of development tools panel

Keep in mind, as a tweet from @ChromiumDev stated, this setting is only active while the devtools are open.

Note that this will result in all resources being reloaded. Should you desire to disable the cache only for some resources, you can modify the HTTP header that your server sends alongside your files.

If you do not want to use the Disable cache checkbox, a long press on the refresh button with the DevTools open will show a menu with the options to Hard Reload or Empty Cache and Hard Reload which should have a similar effect. Read about the difference between the options to know which option to choose. The following shortcuts are available:

  • Command+Shift+R on Mac
  • Control+Shift+R on Windows or Linux

long press

Leave a Comment