Get JavaScripts asynchronously using getScripts

Question

I get some scripts asynchronously on my login page:

 $.when(
 $.getScript("/Scripts/View/scroll-sneak.js"),
 $.getScript("/Scripts/kendo/kendo.custom.min.js"),
 $.Deferred(function (deferred) {
 $(deferred.resolve);
 })
 ).done(function (res1, res2) {
 if (res1[1] == "success") {
 }
 if (res2[1] == "success") {
 }
 alert('all script loaded...');
 });

I have two queries here:

1. How can I leverage browser cache here, as getScript always take fresh script.
2. How can I have promise that this script will be available to all pages on same domain.

Alternate solutions are welcome.

Answer 1

Answer to your first question is set cache true. Jquery documentation page also mentions a way

jQuery.cachedScript = function( url, options ) {
 // Allow user to set any option except for dataType, cache, and url
 options = $.extend( options || {}, {
 dataType: "script",
 cache: true,
 url: url
 });
 // Use $.ajax() since it is more flexible than $.getScript
 // Return the jqXHR object so we can chain callbacks
 return jQuery.ajax( options );
};
// Usage
$.cachedScript( "ajax/test.js" ).done(function( script, textStatus ) {
 console.log( textStatus );
});

For your second question: Please clarify more, what you want to achive?

• A.T.: what if script has size which can't be cached, then how i maintain it
• SSA: If it's not cached then (Highly unlikely until nocache header is set) then it will be requested again. You need not to go that hard on leverage browser caching in this case.