HowTo: jQuery Hosted CDN Version & lokaler “Fallback”

jQuery ist eine der bekanntesten Javascript Frameworks. Allerdings hat es auch schon eine gewisse Größe erreicht – um Traffic zu sparen und noch etwas Ladegeschwindigkeit zu reduzieren kann man auch die “CDN” (quasi hosted) jQuery Version nehmen. Doch wie genau kann man im Notfall noch eine lokale Backup Strategie fahren? Antworten gibt jetzt…

jQuery CDN

jQuery selbst, Google und Microsoft bieten jQuery (+ einige bekannte Plugins) zur Verlinkung auf ihren Servern an. Mehr darüber erfahrt ihr auf diesen Seiten.

Warum sollte man das tun?

Es gibt mehrere Gründe die dafür sprechen können, die gehostete Variante zu nehmen:

• Man spart sich den Traffic. jQuery und co. können durchaus eine markante Größe im Traffic einnehmen.
• Google und co. CDNs sind genau für solche Sachen angelegt. Wenn jemand schnell Content zur Verfügung stellen kann, dann auf solchen Netzwerken.
• Lange Zeit haben Browser nicht mehr als zwei Javascript Dateien von einer Domain geladen. Wenn man jQuery nun von google.com zieht, dann kann der Browser parallel bereits andere applikationsspezifische Dateien laden. Ob das heute noch so eine Rolle spielt kann ich aber nicht mit letzter Sicherheit sagen
• Viele Leute nutzen Google oder Microsofts Dienste oder gehen auf eine Website, welche die jQuery Version von ihnen einbindet. D.h. es besteht die große Chance, dass der Browser jQuery schon irgendwo gecacht da hat – somit fallen Ladezeiten geringer aus!
• Mehr Informationen gibt es z.B. auch noch auf der Yahoo Best Practices Seite.

Welches CDN sollte man nutzen? Microsoft oder Google?

Letztendlich sind beide Dienste ähnlich was das jQuery Hosting angeht. Vermutlich nutzen aber mehr Leute das Google CDN – d.h. die Chance bei Google ist da größer. Hingegen hat Microsoft für ASP.NET Entwickler mit dem ScriptManager ein paar Spielerein eingebaut – brauchen wir aber eigentlich nicht

Hier mal eine Diskussion von Stackoverflow: Microsoft CDN for JQuery or Google CDN?

Warum sollte man es nicht nutzen?

Ganz klar gibt es auch Gründe dagegen. Für interne Applikationen fällt es so oder so aus (da braucht man es aber auch eher weniger) oder wenn man den Dienstleistern nicht vertraut – immerhin hat man eine gewisse Abhängigkeit.

Was passiert wenn es doch mal bei Google/Microsofts/jQuery CDN Probleme gibt?

Nun ja… ich denke zwar nicht, dass eines der CDN so schnell down gehen würde, aber manchmal gibt es vielleicht doch Probleme das CDN zu erreichen. Daher empfehle ich eine eigenes Backup anzulegen und dies im Notfall einzubinden:

<script src="//code.jquery.com/jquery-1.4.4.min.js"></script>
<script>!window.jQuery && document.write(unescape('%3Cscript src="LOKALER_JQUERY_PFAD"%3E%3C/script%3E'))</script>

Da wo “LOKALER_JQUERY_PFAD” steht einfach die entsprechende Pfadangabe angeben. In der Zeile eins wird vom jQuery CDN jQuery eingebunden. Kleiner Hinweis: Wenn es eine HTTP Seite ist würde http://code.jquery… aufgerufen. Wenn es jedoch eine HTTPS Seite ist, wird https://… eingebunden. Das macht dieser “//” Syntax.

Falls nun doch code.jQuery.com down sein sollte

Per Javascript würde in diesem Fall automatisch die lokale Version eingebunden.

About the author

Written by Robert Mühsig

Robert Mühsig (@robert0muehsig) ist Webentwickler und beschäftigt sich mit Web-Frameworks (vor allem dem ASP.NET MVC Framework) und scheut sich auch nicht vor Javascript. Ansonsten bloggt er über all jene Probleme, die ihm über den Weg laufen. Seit 2008 ist er Microsoft MVP für ASP.NET und er arbeitet bei der T-Systems Multimedia Solutions GmbH in Dresden. Treffen kann man ihn online via Twitter (@robert0muehsig) oder dieser Seite oder bei der .NET User Group Dresden.