I normally use Chrome when I develop websites and was about to switch browsers until I learned how to disable the cache in Chrome while developing.
I was so close to switching browsers that I actually wrote a small rant about it here.
Since finding this little trick, Chrome and I are friends again 🙂
There are ways to manually clear your cache, but I do not necessarily want to do that. I usually just want to disable it while I develop. This tutorial shows you how to do just that.
In order to disable the cache while developing, just follow the three easy steps below and you will avoid the headaches that I was having.
How to disable the cache in Chrome while developing
Step 1
While using Chrome to view the website you want to edit, right click anywhere on the page and select “Inspect”.
A window that looks like the image below will appear. By default, the “Elements” section is selected.
Step 2
The fourth tab (heading) from the left, on the newly opened window is “Network”. Go ahead and select “Network”.
Your web-page should now look something like the image below.
Step 3
The final step is to click on the check box next to “Disable cache”. Your web-page should now look like the image below.
That’s it folks, that’s all there is to it. From here forward, when you are developing, just open the developer tools by right clicking and selecting “Inspect”. The cache for Chrome will be disabled.
I normally keep the developer tools open while I develop so this works great for me.
Did this save your sanity? Leave a comment below and tell me about it.
YAY! You are my hero of the day!
That was driving me nuts too and stressing my mouse click finger 🙂 Thank you so much for that USEFUL tip!! It was becoming just such a habit for me to actually clear it out every few times, that I didn’t even notice how much longer it was taking me to make an an update!
I’m glad to hear that it helped you. Sometimes it’s the little things that make the difference.
Another great tip – THANKS!