Several big companies offer copies of jQuery hosted on their CDN’s (Content Delivery Network). Most notoriously Google, but also Microsoft and jQuery themselves. A lot of people swear by this since it saves bandwidth, downloads faster, and perhaps even stays cached jumping between different sites that use the same script.
There is always that twinge of doubt though, that perhaps something goes wrong with these big companies CDN at the script isn’t available (it happens). It’s more reliable to use your own website, as hey, if they are loading your webpage, then your server is up and will server the script just fine, albeit with out the benefits of the CDN.
So perhaps the best solution is to use both methods! Use the CDN first, and if it fails, load the local copy. Here is a technique:
<script type="text/javascript" src="http://ajax.microsoft.com/ajax/jquery/jquery-1.4.2.min.js"></script>
<script type="text/javascript">
if (typeof jQuery == 'undefined') {
document.write(unescape("%3Cscript src='/js/jquery-1.4.2.min.js' type='text/javascript'%3E%3C/script%3E"));
}
</script>
Man, you’ve read my thoughts, I was searching for this today!
Thanks!
You can never be too safe :)
Very cool! I think all sites must use this “solution”.
Nice solution man! I was searching for this :)
huh… I always had a bit of worry in the back of my head about a “hotlinked” js file becoming unavailable for some reason. Hosting my own scripts always seemed safer. Good solution.
You have a special tendency to release important articles at just the right time! Thanks.
How would you set it up to have more than one backup? If you wanted 3 or 4 would you just use more if statements? I would think there is a more efficient way to check until one that works is found.
I think more than 1 backup (where the “1” is the local copy you have) doesn’t make sense.
Having to wait for the client to make multiple connections and fail is way slower than just tring to load from 1 CDN and fallback to local.
Maybe it’s because i’m at the other side of the ocean but i’ve seen it happen that cdn’s load slowly. How long does it take for the response to time out en switch to local? Should I force a time-out after .. miliseconds. How does that work?
On a sidenote, why not simply:
!window.jQuery && document.write('')
whoops:
!window.jQuery && document.write('<script src="js/jquery-1.4.2.min.js"><\/script>')
Just wondering, but can you have the script load Jquery from a second CDN if the first fails? Using Microsoft as a backup to Google for instance?
This seems fairly strait forward but I can’t see where anybody has done it.
That is very helpful. Thanks for gathering all this info, your work is much appreciated!
You, sir, are brilliant and thank you for this.
Thanks, quick and easy to use code. Will use this on some Bitcoin gambling sites.
Hi
I am adding this to sp2010 master page . Just one thing whey do I need the unescape the xml delimiters. Is this something I should do regularly when using jQuery.
Daniel
PS: this is without doubt the most sophisticated (threaded) post comment function I have every seen!
Seems to me that using the code example above, if the CDN is merely slow but not down, you might end up needlessly loading jQuery into the DOM twice.
Helped me out too. Thanks a lot!
Simple but genial! Thank you
I have seen another alternate version of this JQuery CDN Fall Back codes. I’d recommend to use Modernizr tools ( http://modernizr.com/) & or, html5boilerplate (http://html5boilerplate.com/). They save a lot of mishaps.
That’s just what I was looking for :D Thanks.
But how can I do this, with other scripts, too? Like this one:
http://browser-update.org/update.js
It doesn’t seems to work with the typeof thing, if I write update or browser-update or something like that, instead of jQuery.
Any ideas? Thanks in advance. Again thanks a lot for this post.
Best regards
Casper
I can’t comment on the geeky aspects above, but accidentally clicked on the popup head below…… :-) :-)
I really needed that after reading about the “problems” of CDN above.
One of the nicest, cleverest Sites I’ve seen since 1984 – when I started the second BBS in far off Oz (with a lot of tech help – all I supplied was the money and facilities)
I take it that this NOT a WP Site? :-)
WOOPS!
Just looked at the “provenance” of this Site. Even more impressed.
What about for jQuery Mobile?
and what about jquery-ui ?
I used whatdoesitwant‘s idea, which I actually found somewhere else. Very useful, especially for if I’m developing on my laptop and there’s no Internet connection available.
why need to unescape it? I am confused.
I was looking for something similar, can this be altered in a way that would check for a cached version of jquery from google or twitter’s cdn, if it exists, use that, and then if a cahced version is not available in end user’s browser, then load it from our web server instead?
Basically I am thinking that if the user already has the jquery version that my bootsrap site requires for functionality in their browser cache, then use that.. but I would prefer to load from our server if it is not there and not load it from google or twitter.