Search This Blog

Fallback method for your CDN

posted on Friday, September 28, 2012


Remember this one: https://www.thiscouldbeuseful.com/2012/09/library-cdns-or-hosted-libraries.html? The one where I tell you why you should use hosted libraries because they are so great? I hope I managed to convince you of the usefullness :) of this and that you have implemented this or plan to do so soon.

Which brings me to this: whenever you use external sources, you should have a fallback just in case something goes wrong with those external sources. Depending on how much you rely on these resources, this could become a huge problem.

Well, imagine -how unlikely it may seem- that the CDN is down... then what?

Below you can find some code snippets that will help you out! What this code does is check -using javascript- if the jQuery file was loaded properly. If the file wasn't loaded, the jQuery object won't be loaded. So all we have to do is check if this object exists. If it doesn't exist, we load the script locally.
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
<script>window.jQuery || document.write('<script src="js/libs/jquery-1.7.2.min.js"><\/script>')</script>
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js" type="text/javascript"></script>
<script type="text/javascript">
if (typeof jQuery == 'undefined')
{
  document.write(unescape("%3Cscript src='js/libs/jquery-1.7.2.min.js' type='text/javascript'%3E%3C/script%3E"));
}
</script>
As you can see, both scripts initially load the jQuery file from the Google hosted libraries. Next, a plain old javascript script checks if the jQuery object exists. If not, a script tag refering to the local jQuery file is added. The method differs a bit but they do the same thing. I'm not sure how the different browsers respond to this but FireFox, Chrome and IE8 seem to know both jQuery as window.jQuery. I prefer the first one because it requires less code: it's short, simple and effective.

The chances of a CDN going down are slim, but depending on how much jQuery you use, this could really cripple your application. So, I definitely recommend you to implement a fallback for this, for every external source you use if possible.

Good luck and let the CDN's be with you!

Could be useful, right?

No comments:

Post a Comment