How To Add jQuery From CDN? jQuery CDN List For Google, Microsoft, Cloudflare – POFTUT

How To Add jQuery From CDN? jQuery CDN List For Google, Microsoft, Cloudflare


jQuery is a popular JavaScript framework project and library which is used for event handling, CSS animation, and Ajax. jQuery is an open-source library which made it very popular. CDN is Content Delivery Network or Content Distribution Network which is used to distribute files, images, CSS, Javascript, and HTML content over the world into different servers and provide to the client which is the nearest one. This will make the load timeless for a web page because of physical proximity.

jQuery CDN Benefits

As a popular JavaScript framework and library jQuery is provide via CDNs over the world. This will create the following benefits if the CDN is used for jQuery.

  • Faster load time for the web page or application can be reached.
  • Faster load time will cause a better SEO with improved SERP
  • CDNs are more reliable than single servers where the uptime will be better.
  • Lower the load of the webserver by migrating the jQuery to CDN.

jQuery Versions

jQuery is provided with different versions for less size or less functionality. These versions are called and named below.

jquery.js is the normal jQuery file which is not slim or minified. This version is size is bigger than the others.

jquery.min.js is the minified version of the jQuery where spaces and unnecessary characters are removed to make size less.

jquery.slim.js is the less functional version where some less used functions are removed.

jquery.slim.min.js is the smallest version where spaces and unnecessary characters and some functions are removed.

Locally Server jQuery

Let’s start with locally served jQuery which means jQuery file is located on the webserver. We will just provide the path of the jQuery for our web server.

<head>
   <script src="jquery/3.5.1/jquery.js"></script>
</head>
<head>
   <script src="jquery/3.5.1/jquery.min.js"></script>
</head>
<head>
   <script src="jquery/3.5.1/jquery.slim.js"></script>
</head>
<head>
   <script src="jquery/3.5.1/jquery.slim.min.js"></script>
</head>

Add jQuery via Google CDN

Google provides CDN support for the jQuery via the googleapis.com domain. Google CDN for jQuery can be used as below for normal, slim, minimal, and slim+minimal versions.

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

Add jQuery via Microsoft CDN

Microsoft is also another company that provides CDN for the jQuery library. Microsoft CDN for jQuery can be used like below for normal, slim, minimal, and slim+minimal versions.

<head>
   <script src="https://ajax.aspnetcdn.com/ajax/jQuery/jquery-3.5.1.js"></script>
</head>
<head>
   <script src="https://ajax.aspnetcdn.com/ajax/jQuery/jquery-3.5.1.min.js"></script>
</head>
<head>
   <script src="https://ajax.aspnetcdn.com/ajax/jQuery/jquery-3.5.1.slim.js"></script>
</head>
<head>
   <script src="https://ajax.aspnetcdn.com/ajax/jQuery/jquery-3.5.1.slim.min.js"></script>
</head>

Add jQuery via CloudFlare CDN

Cloudflare is the most popular DDOS and CDN service on the net. Cloudflare CDN for jQuery can be used like below for normal, slim, minimal, and slim+minimal versions.

<head>
   <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.5.1/jquery.js"></script>
</head>
<head>
   <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
</head>
<head>
   <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.5.1/jquery.slim.js"></script>
</head>
<head>
   <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.5.1/jquery.slim.min.js"></script>
</head>

LEARN MORE  JavaScript "Uncaught TypeError: Cannot set property '...' of null " Error Solutions

Leave a Comment