Web development Birmingham

How to: Force Google Chrome to not cache resources (scripts, styles, images)

Below is a video demonstrating how to disable caching in Google Chrome:

If you have just had some new changes made to your website it can be frustrating to open up your web browser to find that it looks exactly as it did before - nothing has changed. Though it may seem like your developers have been lieing to you, this is actually a really common occurance that is caused by your browser: For bits of your website that don't change often, your web browser will store a copy of them on your computer and only update them when it thinks they may have changed (i.e. it caches the resources). It does this to improve the speed that a website loads for you, though it can be frustrating when all you want to do is check out the latest changes that your development team have made.

A summary the above video describing how to disable caching in Chrome:

  • Open Google Chrome and navigate to the page you want to test.
  • press F12 or open developer tools from within Chrome's settings (Settings > More tools > Developer tools).
  • Click the cog in the top right of the pop-out box.
  • Check the "Disable Cache (while DevTools is open)" setting box.
  • Close devtools settings but keep the devtools themselves open.
  • Refresh the page.
  • You can undock the devtools from the bottom of your browser by clicking the rectangular icon to the right of the cog icon should you need more space to view the page within.

 

Did you find this article useful? Sharing is a great way to show support, and ensures that we can continue to create more quality articles:

Get a free quote