IT Nota

  • Home
  • How To
  • .NET
  • WordPress
  • Contact
You are here: Home / Coding / Use a CDN Hosted jQuery in Your Website

Use a CDN Hosted jQuery in Your Website

jQuery Logo Serving your jQuery from a public CDN (Content Delivery Network) can arguably offer several advantages to your website, especially if you don’t use a fast server to host it. If you’re not familiar with both sides of the arguments, please check the two attached links below as there’s no points to repeat the subject over the advantages vs. disadvantages of hosting jQuery from a CDN.

PROS – 3 reasons why you should let Google host jQuery for you (broken – 4/26/2017)

CONS – Should You Use JavaScript Library CDNs?

If you ever decide to use CDN jQuery, you can choose to serve the javascript library from one of the three official CDN jQuery hosts (Google, Microsoft, and jQuery) that are listed on the jQuery download page. With the first two as most popular, you can host your jQuery from Google CDN or Microsoft’s. Another host that’s also worth mentioning is cdn js.

You just need to hotlink to any of the CDN you want to use in your source attribute:

<script
  src="//ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js">
</script>

That’s it!

But of course things can go wrong with the CDN server or the routing and for any other bizarre reasons the javascript file is just not available. This scenario can be avoided by creating a fallback method to serve the jQuery from our own website. We can do this by adding the second line (line 4-6):

<script
  src="//ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js">
</script>
<script>
  !window.jQuery && document.write('<script src="/js/jquery-1.12.4.min.js"></script>')
</script>

If you don’t think this technique is sufficient, there are more techniques that might suit your need better from the two links below:

A Simple and Robust jQuery 1.4 CDN Failover in One Line
How and Why: CDN Hosted jQuery with a Local Fall-Back Copy (broken – 5 July 2014)

Most Popular jQuery CDN Links

All three links are listed in the order of popularity. Just use one jQuery CDN link as your source.

Google CDN

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>

jQuery’s CDN

<script src="//code.jquery.com/jquery-1.12.4.min.js"></script>

Microsoft CDN

<script src="http://ajax.aspnetcdn.com/ajax/jQuery/jquery-1.12.4.min.js"></script>

Further Reading

Tips on how to add CDN jQuery for WordPress (Genesis Framework) users

February 2, 2012 Filed Under: Coding, How To Tagged With: HTML, HTML5

Leave a Reply Cancel reply

Your email address will not be published. Required fields are marked *

Buy me a coffee Support this site
Buy Me a Coffee?

Categories

  • .NET
  • Coding
  • Cybersecurity
  • Database
  • How To
  • Internet
  • Multimedia
  • Photography
  • Programming
  • Resources
  • Review
  • Tips and Tricks
  • Use Case
  • WordPress
  • Writing

Recent Posts

  • How to Check Installed .NET Framework Version
  • How to Remove .NET Runtime and SDK on Mac
  • How to Solve Intermittent 403 Error in IIS
  • How to Show Hidden Folders and Files in Mac Finder
  • How to Solve MS Office VBA Compile Error UserAuthentication

Recent Posts

  • How to Check Installed .NET Framework Version
  • How to Remove .NET Runtime and SDK on Mac
  • How to Solve Intermittent 403 Error in IIS
  • How to Show Hidden Folders and Files in Mac Finder
  • How to Solve MS Office VBA Compile Error UserAuthentication
  • RSS

Tags

.NET Access AdSense ASP.NET Cdonts Dll Classic ASP Code Editor ETL FSharp Genesis Framework Git Google HP Asset Manager HTML HTML5 Hugo IIS Information Security Internet Internet Information Services iOS JAMStack Linux macOS Microsoft Microsoft SQL Server MVC PHP Python Simple Mail Transfer Protocol Smtp Server Social Media SQL SQL Server SSIS SSMS SSRS Sublime Text Visual Studio Visual Studio Code VPN Windows Windows 8 Windows 10 Windows Server

Copyright © 2011-2022 IT Nota. All rights reserved. Terms of Use | Privacy Policy | Disclosure