How to turn off caching on Firefox?

JavascriptFirefoxCaching

Javascript Problem Overview


During development I have to "clear cache" in Firefox all the time in order to make it use the latest version of JavaScript files.

Is there some kind of setting (about:config) to turn off caching completely for JavaScript files? Or, if not, for all files?

Javascript Solutions


Solution 1 - Javascript

Enter "about:config" into the Firefox address bar and set:

browser.cache.disk.enable = false
browser.cache.memory.enable = false

If developing locally, or using HTML5's new manifest attribute you may have to also set the following in about:config -

browser.cache.offline.enable = false

Solution 2 - Javascript

The Web Developer Toolbar has an option to disable caching which makes it very easy to turn it on and off when you need it.

Solution 3 - Javascript

Have you tried to use CTRL-F5 to update the page?

Solution 4 - Javascript

There is no specific option to disable caching only for JavaScript, you will have to disable caching entirely.

FireBug has an option to disable the browser cache on the Network tab's drop down menu.

Solution 5 - Javascript

Firefox 48 Developer Tools

Allows you to turn off cache only when toolbox is open, which is perfect for web development:

  • F12
  • gearbox on right upper corner
  • scroll down top Advanced settings
  • check "Disable Cache (when toolbox is open)"

enter image description here

https://stackoverflow.com/a/27397425/895245 has similar content, but positioning changed a bit since.

Solution 6 - Javascript

On the same page you want to disable the caching do this : FYI: the version am working on is 30.0

You can :

open webdeveloper toolbar open web developer

and pick disable cache

After that it will reload page from its own (you are on) and every thing is recached and any furthure request are recahed every time too and you may keep the web developer open always to keep an eye and make sure its always on (check).

Solution 7 - Javascript

If you're working with server side code you could generate a random number and append it to the end of the src in the following manner....

src="yourJavascriptFile.js?randomNumber=434534"

with the randomNumber being randomly generated each time.

Solution 8 - Javascript

I know I'm resurrecting an ancient question, but I was trying to solve this problem today and have an alternate solution. Toggling caching when I want to test was not really acceptable for me, and as others mentioned, hard refreshing (ctrl+shift+r) doesn't always work.

Instead, I opted to put the following in my vhost.conf file (can also be done in .htaccess) on my dev environment:

<FilesMatch "\.(js|css)$">
FileETag None
<IfModule mod_headers.c>
Header unset ETag
Header set Cache-Control "max-age=0, no-cache, no-store, must-revalidate"
Header set Pragma "no-cache"
Header set Expires "Wed, 11 Jan 1984 05:00:00 GMT"
</IfModule>
</FilesMatch>

On my dev environment, this ensures that js and css are always retrieved. Additionally it doesn't affect the rest of my browsing, and it also works for all browsers, so testing in chrome / ie etc is also easy.

Found the snippet here, some other handy apache tricks as well: http://www.askapache.com/htaccess/using-http-headers-with-htaccess.html#prevent-caching-with-htaccess

To make sure that my clients always see the latest version on production, we increment the query string on the js include on each update, ie

jquery.somefile.js?v=0.5

This forces my clients' browsers to update their local cache when they see a new querystring, but then caches the new copy until the file is updated again

Solution 9 - Javascript

You can use CTRL-F5 to reload bypassing the cache.

You can set the preferences in firefox not to use the cache

network.http.use-cache = false

You can setup you web server to send a no-cache/Expires/Cache-Control headers for the js files.

Here is an example for apache web server.

Solution 10 - Javascript

Best strategy is to design your site to build a unique URL to your JS files, that gets reset every time there is a change. That way it caches when there has been no change, but imediately reloads when any change occurs.

You'd need to adjust for your specific environment tools, but if you are using PHP/Apache, here's a great solution for both you, and the end-users.

http://verens.com/archives/2008/04/09/javascript-cache-problem-solved/

Solution 11 - Javascript

If you use FireBug, on the Network tab's drop down menu there is an option do disable the browser's cache.

enter image description here

Solution 12 - Javascript

I use CTRL-SHIFT-DELETE which activates the privacy feature, allowing you to clear your cache, reset cookies, etc, all at once. You can even configure it so that it just DOES it, instead of popping up a dialog box asking you to confirm.

Solution 13 - Javascript

There are pros and cons to the last two solutions posted, but they're both IMHO great solutions.

  1. You may or may not want your session ID embedded in your url like that for tighter security. But in development that shouldn't matter, but what if you forget to remove it? Also does that really work? Wouldn't you need something like a sequential number generator (hit count stored in the session, or maybe even just if 1 then 0, if 0 then 1)?

  2. Adding a session id (or whatever sequencer) means you need to remember to add it to every resource you don't want cached. On the one hand that's better because you can just include your session id with just that resource you're actively developing and testing. On the other hand, it means you have to do that and you have to remember to remove that for production.

  3. Modifying the vhost.conf or the .htaccess file does the trick nicely without the need to remember to add and remove the session id. But the downside is performance of all js and css resources will be affected, and if you have large files, that's going to slow you down.

Both seem like great, elegant solutions -- depends on your needs.

Solution 14 - Javascript

In higher versions of Firefox, like Nightly, there is an options named "disable cache", you can find it by clicking the gear. And that options works only in current session, which means when you close inspector and restart it, you have to check it again if you want catch disabled.

Solution 15 - Javascript

After 2 hours of browsing for various alternatives, this is something that worked for me.

My requirement was disabling caching of js and css files in my spring secured web application. But at the same time caching these files "within" a particular session.

Passing a unique id with every request is one of the advised approaches.

And this is what I did :- Instead of

<script language="javascript" src="js/home.js"></script>

I used

<script language="javascript" src="js/home.js?id=${pageContext.session.id}"></script>

Any cons to the above approach are welcome. Security Issues ?

Solution 16 - Javascript

In firefox 45, disk cache options can be set by changing the value of: browser.cache.disk.enable

The value can be set on the "about:config" page.

On http://kb.mozillazine.org/About:config_entries#Browser I found the following description for "browser.cache.disk.enable":

True (default): Use disk cache, up to capacity specified in browser.cache.disk.capacity False: Disable disk cache (same effect as setting browser.cache.disk.capacity to 0)

Solution 17 - Javascript

First of All, this can be easily done, for e.g. by PHP to force the browser to renew files based on cache date (expiration time). If you just need it for experimental needs, then try to use ctrl+shift+del to clear all cache at once inside Firefox browser. The third solution is to use many add-ons that exits for Firefox to clear cache based on time lines.

Attributions

All content for this solution is sourced from the original question on Stackoverflow.

The content on this page is licensed under the Attribution-ShareAlike 4.0 International (CC BY-SA 4.0) license.

Content TypeOriginal AuthorOriginal Content on Stackoverflow
QuestionThiloView Question on Stackoverflow
Solution 1 - JavascripttstView Answer on Stackoverflow
Solution 2 - JavascriptphilnashView Answer on Stackoverflow
Solution 3 - JavascriptsomeView Answer on Stackoverflow
Solution 4 - JavascriptkynanView Answer on Stackoverflow
Solution 5 - JavascriptCiro Santilli Путлер Капут 六四事View Answer on Stackoverflow
Solution 6 - JavascriptshareefView Answer on Stackoverflow
Solution 7 - JavascriptRekrowYnapmocView Answer on Stackoverflow
Solution 8 - JavascriptKevin JhangianiView Answer on Stackoverflow
Solution 9 - JavascriptPatView Answer on Stackoverflow
Solution 10 - JavascriptscunliffeView Answer on Stackoverflow
Solution 11 - JavascriptNerdroidView Answer on Stackoverflow
Solution 12 - JavascriptMr. Shiny and New 安宇View Answer on Stackoverflow
Solution 13 - JavascriptmeemView Answer on Stackoverflow
Solution 14 - JavascriptjiyinyiyongView Answer on Stackoverflow
Solution 15 - JavascriptDarshanView Answer on Stackoverflow
Solution 16 - JavascriptDanielView Answer on Stackoverflow
Solution 17 - JavascriptAmir GhorbaniView Answer on Stackoverflow