Microsoft Cdn for Jquery or Google Cdn

Microsoft CDN for jQuery or Google CDN?

Update based on comments:

Short version: It doesn't matter much, but it may depend on what they host. They all host different things: Google doesn't host jQuery.Validate, Microsoft did not host jQuery-UI, since 2016 they do!!, Microsoft offers their scripts that would otherwise be served via ScriptResource.axd and an easier integration (e.g. ScriptManager with ASP.Net 4.0).

Important Note: If you're building an intranet application, stay away from the CDN approach. It doesn't matter who's hosting it, unless you're on a very overloaded server internally, no CDN will give you more performance than local 100mb/1GB ethernet will. If you use a CDN for a strictly internal application you're hurting performance. Set your cache expiration headers correctly and ignore CDNs exist in the intranet-only scenario.

The chances of either being blocked seems to be about equal, almost zero. I have worked on contracts where this isn't true, but it seems to be an exception. Also, since the original posting of this answer, the context surrounding it has changed greatly, the Microsoft CDN has made a lot of progress.

The project I'm currently on uses both CDNs which works best for our solution. Several factors play into this. Users with an older browser are still probably making 2 simultaneous requests per domain as recommended by the HTTP specification. This isn't an issue for anyone running anything decently new that supports pipelining (every current browser), but based on another factor we're knocking out this limitation as well, at least as far as the javascript.

Google's CDN we're using for:

  • jquery.min.js
  • jquery-ui.min.js.

Microsoft's CDN we're using for:

  • MicrosoftAjax.js
  • MicrosoftAjaxWebForms.js (until 4.0 we're not completely removing all UpdatePanels)
  • jQuery.Validate.min.js

Our server:

  • Combined.js?v=2.2.0.6190 (Major.Minor.Iteration.Changeset)

Since part of our build process is combining and minifying all custom javascript, we do this via a custom script manager that includes the release or debug (non-minified) versions of these scripts depending on the build. Since Google doesn't host the jQuery validation package, this can be a down-side. MVC is including/using this in their 2.0 release, so you could rely completely on Microsoft's CDN for all your needs, and all of it automatic via the ScriptManager.

The only other argument to be made would be DNS times, there is a cost to this in terms of page load speed. On Average: Simply because it's used more (it's been around longer) ajax.googleapis.com is likely to be returned by DNS sooner than ajax.microsoft.com, simply because the local DNS server was more likely to get a request for it (this is a first user in the area penalty). This is a very minor thing and should only be considered if performance is extremely important, down to the millisecond.

(Yes: I realize this point is contrary to my using both CDNs, but in our case the DNS time is far overshadowed by the wait time on the javascript/blocking that occurs)

Last, if you haven't looked at it, one of the best tools out there is Firebug, and some plug-ins for it: Page Speed and YSlow. If you use a CDN but your pages are requesting images every time because of no cache-headers, you're missing the low-hanging fruit. Firebug's Net panel can quickly give you a quick breakdown of your page load-time, and Page Speed/YSlow can offer some good suggestions to help.

Why should I use Google's CDN for jQuery?

This is because:

  1. It increases the parallelism available.
    (Most browsers will only download 3 or 4 files at a time from any given site.)

  2. It increases the chance that there will be a cache-hit.
    (As more sites follow this practice, more users already have the file ready.)

  3. It ensures that the payload will be as small as possible.
    (Google can pre-compress the file in a wide array of formats (like GZIP or DEFLATE). This makes the time-to-download very small, because it is super compressed and it isn't compressed on the fly.)

  4. It reduces the amount of bandwidth used by your server.
    (Google is basically offering free bandwidth.)

  5. It ensures that the user will get a geographically close response.
    (Google has servers all over the world, further decreasing the latency.)

  6. (Optional) They will automatically keep your scripts up to date.
    (If you like to "fly by the seat of your pants," you can always use the latest version of any script that they offer. These could fix security holes, but generally just break your stuff.)

Using Google and Microsoft CDN for jquery file reference

It will just cache them with the given URL and any page requesting the same file from the same url can use it, even across different domains - Google made a big thing a couple of years ago about including JQuery in their main search page, in the exact same manner as they require other CDN users to do it, so that the vast majority of people already had their CDN version of JQuery available.

Something else to look into if you want to start using CDNs is "protocol independent urls" - let the browser select the right protocol (https or http) depending on the protocol of the current page, so you avoid "some items on this page are not secure" errors.

URI starting with two slashes ... how do they behave?

Redundant to let Microsoft and Google host jQuery

I think either one would be fine. In addition, it's good practice have your code fall-back to local (on your own server) copy of jQuery.

Best way to use Google's hosted jQuery, but fall back to my hosted library on Google fail

You can achieve it like this:

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.2.6/jquery.min.js"></script>

<script>
window.jQuery || document.write('<script src="/path/to/your/jquery"><\/script>');
</script>

This should be in your page's <head> and any jQuery ready event handlers should be in the <body> to avoid errors (although it's not fool-proof!).

One more reason to not use Google-hosted jQuery is that in some countries, Google's domain name is banned.

jquery from cdn

fOR jQUERY

<script type="text/javascript" src="http://ajax.microsoft.com/ajax/jquery/jquery-1.3.2.min.js"></script>
<script type="text/javascript">
if (typeof jQuery == 'undefined')
{
document.write(unescape("%3Cscript src='/scripts/jquery-1.3.2.min.js' type='text/javascript'%3E%3C/script%3E")); //local
}
</script>

For Jquery Ui

if (jQuery.ui) {
document.write(unescape("%3Cscript src='/scripts/jqueryui-1.8.2.min.js' type='text/javascript'%3E%3C/script%3E")); //local
}

For Jquery validate

if(!jQuery().validate) {
document.write(unescape("%3Cscript src='/scripts/jquery.validate.min.js' type='text/javascript'%3E%3C/script%3E")); //local
}

Links
MS validate.js - http://ajax.microsoft.com/ajax/jQuery.Validate/1.6/jQuery.Validate.min.js

Google jquery.min.js - http://ajax.googleapis.com/ajax/libs/jquery/1.4.0/jquery.min.js

Google jquery.ui.js - http://ajax.googleapis.com/ajax/libs/jqueryui/1.7.2/jquery-ui.min.js

Google JqueryUi theme- (change base to one of the core theme name) http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.9/themes/base/jquery-ui.css

Is using a CDN for jQuery (or other static files/scripts) really a good idea?

Two part answer:

  • You shouldn't be seeing 304s
  • But is it a good idea?

You Shouldn't Be Seeing 304s

I understand that when I visit many sites using, say, jQuery from Google's CDN, it will have to "download" the script only once for a very long time, but my browser still tries to connect to the Google's server, and ask for the script file, and then receive 304 not modified status code.

It shouldn't, not if it's respecting the Cache-Control header:

Cache-Control:public, max-age=31536000

...which says from the date on the resource, the browser can cache it for up to a year. No need for any HTTP request at all (and that's what I see in Chrome unless I force it, no request at all, just a note saying "from cache"; fired up Firefox and made sure Firebug was on for all pages, came to StackOverflow for the first time in a long time with Firefox [which I only use for testing], and sure enough, it didn't issue any request for jquery at all).

E.g., maybe it takes 200ms for a 304 response, but if your browser is caching correctly, it'll be 0ms for a load-from-cache.

The full set of relevant headers I see on a forced request are:

Cache-Control:public, max-age=31536000
Date:Wed, 17 Aug 2011 21:56:52 GMT
Expires:Thu, 16 Aug 2012 21:56:52 GMT
Last-Modified:Fri, 01 Apr 2011 21:23:55 GMT

...so my browser shouldn't have to request that path again for nearly a year.

See @Dave Ward's comment below: To get max caching results, use the full release number, e.g.:

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js'></script>
<!-- very specific ---^^^^^ -->

rather than

<script src="//ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js'></script>
<!-- very generic ----^ -->

Okay, but is it a good idea?

That's entirely up to you. Even with a fallback like this:

<script src="//ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js'></script>
<script>
if (typeof jQuery === "undefined") {
document.write("<scr" + "ipt src='/my/local/jquery.js'></scr" + "ipt>");
}
</script>

...or similar, the UX if the CDN is down is going to be awful. The browser is going to spin for ages trying to connect to it. That kind of fallback will only help if the CDN quickly replies with a failure, which is unlikely.

This means if Google's CDN goes down, you would have to quickly adjust what you're serving to use your local copy instead. So defending against that becomes a monitoring exercise (of Google's servers; don't overdo it or they'll be displeased) with a failover at the server level to start serving pages with a local path. (Or a Microsoft path, on the theory that Google and Microsoft probably aren't sharing underlying CDN technology, given how well they get along.)

For me, the answer for most sites is probably: Go ahead and use the CDN, react if and when Google's CDN for libraries goes down. The flip side is: If you're happy with your overall page load performance loading it from your server, little harm in doing that until or unless traffic is high enough that you're looking to eke every last bit of performance out of things. But lots (and lots and lots) of sites rely on Google's CDN, if it goes down, your site will be far from alone in failing...

Google cdn for jquery themes

You can find the smoothness theme from google cdn in http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.7/themes/smoothness/jquery-ui.css.

The url is

http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.7/themes/< themename >/jquery-ui.css

where < themename > is the name of the theme you want.

The i18n file from cdn can be found in http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.6/i18n/jquery-ui-i18n.min.js

Hosted Microsoft Ajax on CDN?

Microsoft launched today the Microsoft AJAX CDN that will provide Microsoft AJAX and jQuery libraries.



Related Topics



Leave a reply



Submit