How to clear cache for specific URL or site on Chrome or Firefox for MacOS or Windows
This article presents a solution to the problem of your web application not reloading the latest changed version of your code. This can happen for various reasons, the main reason seems to be browser caching.
Jump to solution for Chrome on MacOS and Windows or the solution for Firefox on MacOS and Windows. You can also jump to the step by step solution.
Browser caching is…
Problem
The problem is when our browser has cached a specific site or URL, which has then since changed, and we want to load fresh from the source. Often times hitting F5
or shift
+ F5
does not work.
The solution that is often given is to clear the browser cookies and cache. This may work, but often we don’t want to clear out all our existing cache and cookies for sites we use often like email and social media etc. Especially if we have to log back in with 2 Factor Authentication (2-FA), this can become a hassle.
A trick you can try is to use the developer tools. This can be done on either Google Chrome, or Firefox.
I have found this is a great solution when you don’t want to clear the entire cache and history in your browser. or, even the cache and history just for the last 24 or 1 hour that google chrome now offers. Both of these options can be quite a hassle.
The next sections provide details of a quick solution for the problem of clearing the web browser cache for a single URL, website or domain on MacOS or Windows. The solution works on both Firefox and Google Chrome.
Solution for Google Chrome on MacOS and Windows
Solution for chrome to clear cache for one URL or site which works on both MacOS and Windows.
If you navigate to an empty section of the web page you want to refresh, and right click to bring up the context menu. From the context menu, select the inspect
option. This will bring up the Google Chrome developer tools (this may look a little scary if you are not used to web development). You then need to select the network
tab option, and tick the disable cache
option. You can now refresh your page, and close the developer tools by clicking the x
in on the right hand side of the developer tool menu.
Solution for Firefox on MacOS and Windows
Solution for Firefox to clear cache for one URL or site which works on both MacOS and Windows.
If you navigate to an empty section of the web page you want to refresh, and right click to bring up the context menu. From the context menu, select the inspect element
option. This will bring up the Firefox developer tools (this may look a little scary if you are not used to web development). You then need to select the network
tab option, and tick the disable cache
option. You can now refresh your page, and close the developer tools by clicking the x
in on the right hand side of the developer tool menu.
Step by step Solution
I have put together a more detailed step by step of the solution, for the users who are having difficulty following instructions in the section above.
If you are still having difficulties, then reach out and I can see if I can help.
1. Navigate to an empty section of the web page you want to refresh, and right click to bring up the context menu.
2. From the context menu, select the inspect
on Google Chrome or inspect element
option in Firefox.
3. This will bring up the Firefox developer tools (this may look a little scary if you are not used to web development).
You then need to select the network
tab option.
4. From the network option tab, there will be an option labelled disable cache
.
5. You can now refresh your page, and close the developer tools by clicking the x
in on the right hand side of the developer tool menu. You page should have reloaded from the source.