Are the .js files being cached?

Question

I recently made a website and I made a change to a .js file, but when I delete the .js file from the FTP server and upload the new one, the new file doesn\'t show up on the

Answer 1

I am not positive that no-cache meta tag is the way to go. It negates all caching and kind defeats the purpose of quickly accessible pages.

Also, AFAIK, meta tag works per page, so if you have a page without it that references your JS - it will be cached.

The widely acceptable way of preventing JS files (and, again, CSS) from being cached is to differentiate the requests for them:

Say, you have:

<script type=”text/JavaScript” src=”somescript.js″></script>

this one will cache it (unless the above meta-tag is present.

What you want to have is that on each page load the above line looks different (URL-wise) like so:

<script type=”text/JavaScript” src=”somescript.js?some-randomly-generated-string″></script>

Same goes for CSS.

If you were using some sort of JS network - it would take care of that for you had you given it some sort of "no-cache" configuration option.

You, of course, can do it in pure JS too. Some sort of Date related string is an option.

---

Now, normally, you would not want to negate all the caching, so the way to do so is to add a version parameter to your URL:

<script type=”text/JavaScript” src=”somescript.js?version=1.0.0″></script>

and manage your scripts from there.

EDIT

There is no need for any additional extension. Unless I am sorely mistaken, "Chrome Developer Tools" is built in in all Chrome versions (in beta and dev, for sure) and is accessible by pressing Ctrl-Shift-I. There, in "Network" tab, you can see all your requests, there content and headers.

Answer 2

Use an incognito instance of chrome (ctrl+shift+n) to check the source, this mode won't use any cached files. With this you can check if your file is being cached on the client side.

If it's on the client side make sure your server is not sending cache-control headers along with the JS file.

If it's on the server then there's a ton of possibilities, maybe you have a reverse proxy, a physical load-balancer or some other type of caching mechanism.

Edit (question changed):

Use this chrome extension to check the headers being sent along with your .js files. There's probably a cache-control header set that instructs chrome to cache the resource.

If you're on apache you can override this behaviour using an .htaccess file.

Answer 3

Yes. The resources are still cached. In my opinion a good practice to avoid this is to version your resources files in a url?parameter=value way.

For example you should set the ulr to your js or css file like this: < ... src="script.js?v=1" .../> < ... href="style.css?v=1 .. /> and when any changes occured just change v=1 to v=2 ...

that will not affect your code but will make your browser/proxy etc to redownload the resource