Caching of JS resources with AJAX call in JQuery tools

Question

In my application I'm using the overlay effect of jquerytools. I'm opening an external page inside the overlay as explained in this demo. In my external page I'm using some javascripts to do validation and so on. My application is using the Struts2 framework.

The problem I have is concerning the performances of the overlay effect. In the web server (apache) I'm using the mod_expires to let the browser cache the resources. The problem is that while the file jquery-1.7.2.min.js gets cached in all the application when opening the overlay it won't be cached because it's name changes with an dynamically generated numerical string.

For example the file name changes in this way:

• Main application: jquery-1.7.2.min.js
• Inside the overlay: jquery-1.7.2.min.js?_=1386932790620

This numerical string changes everytime, preventing the browser (Chrome) to cache the resource. So every time a user opens the overlay the jquery-1.7.2.min.js gets downloaded slowing down the performances.

You can see this problem in the attached pictures:

Caching:

Non caching:

I guess that the overlay effect of jquerytools is using AJAX to load an external page, so the question is: is there a way to remove that numeric string from being attached to the resource name?

There'are other solutions to prevent the overlay effect to download everytime the javascript resource?

Answer 1

You can try adding this to your code -

$.ajaxSetup({ cache: true });

This will ensure that no cache-busting strategy is used by jQuery.