Force-refreshing only JavaScript files in Firefox and Chrome

Question

I want to clear only JavaScript files from my web browsers (Firefox and Chrome). I am doing JavaScript debugging, and it's annoying that my JS just won't get updated whenever I change my JS files. The only thing I can do now is to clear my cookies, but doing that erases all of my browsing history.

How can I clear/refresh the JavaScript files that have been loaded into my browsers without clearing out other files?

score 51 · Answer 1 · answered Sep 02 '11 at 18:08

51

With Chrome:

Starting with Chrome 15, open the Developer Tools, click on the cogwheel at bottom left of the screen, and select the checkbox Disable cache.

Disable cache in Chrome 15 and up

This way, you will be sure that resources are always reloaded from the server, and you don't have to manually clear the cache, which might also remove cached data for unrelated sites.

answered Sep 02 '11 at 18:08

avernet

2,261
5
24
25

Thanks for the tip - I just checked and that option is in Chrome 14 also. – keybits Sep 09 '11 at 18:00
Genius! That's a great find. – Randomblue Sep 30 '11 at 21:00
Brilliant, I was looking for this. – Artem Russakovskii Jul 13 '12 at 03:25
... and just don't forget to uncheck the option after you are done with it. – Halil Özgür Nov 30 '12 at 11:43
On a second take, it looks like these options are only active when the devtools is visible: https://twitter.com/ChromiumDev/status/227356682890670080 (from http://stackoverflow.com/a/7000899/372654) – Halil Özgür Nov 30 '12 at 11:55
saved lot of time on clearing cache manually – kongaraju Apr 09 '13 at 10:30

score 48 · Accepted Answer · edited Dec 08 '18 at 20:27

48

I do this myself for development. I use Ctrl+F5. It's like a force refresh. This refreshes the page including re-downloading any referenced JavaScript files or CSS files even if they were cached.

It will NOT clear anything else such as your browsing history.

But please note that although I know this works in Firefox, and probably Internet Explorer, I am not sure if Ctrl+F5 works the same way in Chrome.

Also, iegik says:

On some browsers you can use `Ctrl+Shift+R to do the same task.

edited Dec 08 '18 at 20:27

Peter Mortensen

12,090
23
70
90

answered Sep 05 '09 at 02:54

7wp

1,470
2
19
25

Great! I change the accepted answer to yours because yours is a simpler solution – Graviton Sep 05 '09 at 03:18
I appreciate that... But please note that although I know this works in Firefox, and probably IE, I am not sure if CTRL-F5 works the same way in Chrome. – 7wp Sep 05 '09 at 03:27
Well, it doesn't really matter because even though I use Chrome as my main browser, but I use firefox as my debugging browser, thanks to firebug – Graviton Sep 07 '09 at 16:30
No good for OSX, I still have to restart Chrome – mdoar Aug 26 '10 at 23:04
2

Same with Chrome 21 beta on Win7 - refreshing the page with ctrl-f5 doesn't re-request the JS file (I'm using Charles to double verify). – Artem Russakovskii Jul 13 '12 at 03:24
1

actually chrome treats first ctrl+f5 as normal refresh by design, subsequent ctrl+f5 (more then one) in short time will force reload of all sources – Zeela Sep 07 '12 at 12:06
Its not working at all times in chrome the disable cache is good. – kongaraju Apr 09 '13 at 10:29
1

For Chrome, F12 and rightclick the reload button. http://superuser.com/questions/220179/how-can-i-do-a-cache-refresh-in-google-chrome – Cees Timmerman Mar 24 '15 at 08:52
control+F5 does the same thing as F5 for me on firefox. I can't get it to reload the javascript file that I've changed. – curtis Feb 17 '16 at 00:29
CTRL-F5, or alternatively SHIFT-click on the reload button does the same thing. But these may fail to fully refresh assets (JS, CSS, images, etc.) loaded by frames/iframes contained within the main page; so if the script in question is inside an iframe, it might not reload as expected. To force it to, you can right-click -> "This Frame" -> hold down SHIFT and select "Reload". (You DO need the SHIFT, even though there's no indication in the menu that it does anything - as when clicking the reload button, SHIFT forces the reload to bypass the local cache and do a full reload from the server). – Doin Dec 30 '19 at 10:25
Oh, I was talking about Firefox above. Not sure if Chrome has exactly the same feature. – Doin Dec 30 '19 at 10:27

score 10 · Answer 3 · edited Mar 13 '13 at 11:25

I disagree with @7wp. Since some of your end users aren't familiar with the Ctrl+F5 function, and some aren't even aware of the differences between browsers and even the existance of other browsers (elders for example) you should force the browser to download a new copy of the JS/CSS files.

The best solution here is to add the timestamp at the end of the .js/.css filenames, or add the svn version which is a great idea too.

<script src="js/myfile.js?t=<?=time()?>" type="text/javascript"></script>

RoyalKnight · Answer 4 · 2009-09-05T02:38:01.857

You might want to try clearing just your cache, and not your entire browsing, history, cookies, passwords, saved form data, and whatnot (the default).

In Firefox 3.5, go to

Tools » Clear Recent History...

Then make sure only "Cache" is selected before selecting "Clear Now."

In Chrome (don't know what particular version you're using, as I use the dev builds), go to

Wrench Icon (Tools) » Options » Personal Stuff tab » Clear browsing data...

Again, make sure only "Empty the cache" is checked.

Alternatively, you can try opening up a new Private session in Firefox or Incognito window in Chrome; neither should cache any files (including your .JS files) you automatically download and process when browsing.

Incognito is probably the way to go for Chrome. – mdoar Aug 26 '10 at 23:04 — mdoar, Aug 26 '10 at 23:04

score 2 · Answer 5 · edited Dec 08 '18 at 20:31

2

I open the JavaScript file in a separate tab, Shift + refresh, verify that I'm seeing the latest changes, then Shift + refresh the actual page (actually, in my case, frame in a frameset, which seems to make matters worse). This works almost all the time.

edited Dec 08 '18 at 20:31

Peter Mortensen

12,090
23
70
90

answered Jun 20 '12 at 15:41

doug mayo-wells

21
1

Works as a last resort! – Doin Dec 30 '19 at 10:17

score 1 · Answer 6 · edited Dec 08 '18 at 20:31

1

In Chrome you can just press Ctrl and click the refresh button. I discovered this by chance.

edited Dec 08 '18 at 20:31

Peter Mortensen

12,090
23
70
90

answered Aug 07 '11 at 13:36

Julio Bahar

111
1

This does a hard refresh of the entire page, I don't think this just refreshes Javascript only. – Ivo Flipse Aug 07 '11 at 13:56

score 1 · Answer 7 · edited Dec 08 '18 at 20:30

1

I've been using a little trick on a site that I'm working on...for the same reasons as you. I make small changes and have JavaScript code loaded by JavaScript code and want to make sure that I'm always working with the current (non-cached) script.

Try making the JavaScript code you are loading into a PHP file...simply put <?php ?> at the beginning and put on the ext of .php.

var fileref = document.createElement('script');
fileref.setAttribute("type", "text/javascript");

// The Date added to the file doesn't effect the results but
// helps Internet Explorer be sure to refresh the data and
// not use cache

var d = new Date();

var t = d.getTime();

fileref.setAttribute("src", filename + ".php?date=" + t);

fileref.setAttribute("id", filename);

Because the name changes, Internet Explorer thinks it is a new file ;)

edited Dec 08 '18 at 20:30

Peter Mortensen

12,090
23
70
90

answered Sep 16 '09 at 14:30

2

Doesnt need to change the name to '.php'. If you put 'filename.js?t='+t the result is the same. You can do it with '.css' too. All ours production systems use this trick to certify that the clients uses the right content files. – Leonel Martins Sep 21 '09 at 13:17
1

As a note, we tend to use the SVN revision number instead of date/time. That way we get caching benefits, and refresh only when we actually commit. – vgru Jan 21 '11 at 13:50
Thanks so much! This trick totally slipped my mind. I've been battling this issue for days and this'll do it for me. I just put this at the end of the url: "?" – thrashr888 Mar 17 '11 at 16:34

score 0 · Answer 8 · edited Dec 08 '18 at 20:32

0

If you are working with JavaScript and worried about reloading the page to reflect JavaScript changes. Try to use the Chrome debugger, where you can make changes to your loaded JavaScript file(s) at run time and without using any reload can test new functions or changes you want to test.

edited Dec 08 '18 at 20:32

Peter Mortensen

12,090
23
70
90

answered Dec 20 '16 at 12:31

Nikhil Joshi

1
1

Welcome to Super User! Please read the question again carefully. Your answer does **not** answer the original question. – DavidPostill Dec 20 '16 at 13:42

score 0 · Answer 9 · edited Dec 08 '18 at 20:33

0

In the latest Chrome it is available:

edited Dec 08 '18 at 20:33

Peter Mortensen

12,090
23
70
90

answered Oct 31 '18 at 08:21

Baljeetsingh Sucharia

237
2
9

Some elaboration wouldn't be amiss. – Peter Mortensen Dec 08 '18 at 20:34

score 0 · Answer 10 · answered Sep 05 '09 at 02:23

0

I've not used it myself, but the Firefox Add-on "Clear Cache Button" might be of use. I read through their documentation, so I'm not sure if it clears your browsing history too.

answered Sep 05 '09 at 02:23

Jared Harley

12,552
3
41
51

score 0 · Answer 11 · edited Dec 08 '18 at 20:35

0

Add some dynamic date function at the end of your JavaScript file. It will force the browser to load the updated JavaScript file. Meaning, when including the .js file you could add .... xyz.js?

< ? php echo date('l jS \of F Y h:i:s A') ? >

Of course this could be removed once your debugging is done and ready to go live.

edited Dec 08 '18 at 20:35

Peter Mortensen

12,090
23
70
90

answered Oct 10 '12 at 11:02

Chris

9
1

This is not Javascript. – Natalie Adams Dec 12 '12 at 17:45

score 0 · Answer 12 · edited Feb 22 '13 at 15:05

0

Go to content settings in Chrome, disable JavaScript and save.

Then, enable JavaScript again.

edited Feb 22 '13 at 15:05

slhck

223,558
70
607
592

answered Feb 22 '13 at 14:23

nisar

1

Force-refreshing only JavaScript files in Firefox and Chrome

12 Answers12

Linked

Related