chrome javascript css

Chrome DevTools tip - disabling the cache

Feb 15, 2020

Quick tip in Chrome DevTools to disable the cache when developing. Browsers cache front-end content like JavaScript, CSS to improve browsing experience. However this is painful when you are developing a website since you need to see the results straight away instead of the cache.

Browsers such as Chrome caches front-end files such as JavaScript and CSS. This is useful for normal browsing but can be really annoying when developing or designing a website. You want to see the result straight away instead of clearing the cache every time you make a change.

Previously, I was using Control + F5 to clear clear the cache in Chrome.

Just found out that there’s a way to disable the cache in Chrome:

Open up DevTools and go to Settings

Tick the Disable Cache (while DevTools is open)

Only issue with this is that you have to always keep DevTools open - eg less screen real estate.

Hope you found this useful.

See Also

Different methods to filter a JavaScript array of objects

Read more

Simple CSS reset code

Read more

Using CSS to highlight images not containing the 'alt' attribute

Read more