QUESTIONS?

Updates & insights on all things CDN

jsDelivr does it better

jsDelivr640px-v2 If you are not familiar with jsDelivr then check out our previous blog post with details on Load Balancing and Multi-CDN features that it supports. This time jsDelivr introduces a few new features that will help web developers and website owners even further.  

Version Aliasing

So far to load a library on all public CDNs including jsDelivr you had to use a unique URL for each file and version. If the project got updated, you then had to update your URLs to switch to the new hosted version. This is a task that no-one has time to bother with, and results in websites using outdated libraries that could have performance penalties or even security issues.

Google Hosted Libraries partially solves this issue by including a limited feature to load aliased versions of their hosted files. For example you can load the latest version of jQuery in the v1 branch by using the following url:

http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js

Unfortunately you can’t load the latest 1.9 or 1.10 branch versions.

But with jsDelivr you can now use aliased versions to load any possible combination.

Lets take for example the project Abaaso. At this moment the latest version is 3.10.50 and you can load it by specifying the exact version in your url as always. But since this project gets updated very often you would end up with using the old version pretty soon.  To overcome this problem you can now simply use the following URL:

http://cdn.jsdelivr.net/abaaso/3.10/abaaso.min.js

By using 3.10 you tell jsDelivr to load the latest version it has in the 3.10 branch which in this case is 3.10.50. This is the optimal solution for most authors because they can load the latest minor version without worrying for major changes that could break their website.

It is of course possible to load the latest version in the v3 branch by using the following URL:

http://cdn.jsdelivr.net/abaaso/3/abaaso.min.js

And if for any reason you need to always load the latest available version in any major branch you can use:

http://cdn.jsdelivr.net/abaaso/latest/abaaso.min.js

By using the ‘latest’ version you tell the server to load the absolute latest version he has. This of course is dangerous and given enough time may and will break your website. So use this feature with caution.

Load Multiple files with a single HTTP request

I am happy to announce that jsDelivr is the first CDN to support this kind of functionality.

You can now load any amount of javascript libraries or plugins you want, including specific versions and version aliasing functionality with 1 HTTP request.

One of the major arguments against using public CDNs is that by combining the needed files and loading them from your own local server (or private CDN) is actually better and faster than loading each required file separately resulting in multiple HTTP requests.

Well now you can benefit by combining files into a single HTTP request and at the same time using a fast CDN.

Its very simple to use, you simply have to add a group parameter and specify the projects you want to load including versions. So for example to load abaaso, ace and alloyui you use the following URL:

http://cdn.jsdelivr.net/g/abaaso,ace,alloyui

Thats it, now these 3 libraries are combined into a single file in the order you specified them. But now you have loaded the latest versions of all of projects. As I said earlier this can be dangerous and to overcome this problem it is advised to specify the versions you want to load.

http://cdn.jsdelivr.net/g/abaaso@3.10.50,ace@1.1.01,alloyui@2.0.0pr6

And of course you can use the same version aliasing functionality described above in these group URLs:

http://cdn.jsdelivr.net/g/abaaso@3.8,ace@1.1,alloyui@2.0

At this moment the above URL will combine Abaaso 3.8.50, ace 1.1.01 and alloyui 2.0.0pr6 and load them in a single HTTP request.

If you try to load a group URL and one of the projects you specified encounters a problem like wrong version, then the whole URL will fail and output a 404 error with the name of the project that failed.

The group loading functionality is based on the “mainfile” parameter that every project hosted on jsDelivr now has. This parameter specifies what is the main file of the project and is loaded each time you create a group URL.

When creating group URLs think about the dependencies of each project you are loading. All files are loaded in the same order they are specified in the URL. This means that you should always list first libraries like jQuery and then any jQuery plugins you might need.

It is also important to specify that both aliased versions and group projects are dynamically generated. So the first 3-4 uncached requests will be slow to load. After that the CDN will cache it and treat it as a normal static file.

On top of that all “dynamic URLs” are cached only for 6 months on our CDNs. "latest" versions are cached only for 7 days to ensure the user is always up-to-date. If you disagree with this then feel free to open a Github issue and discuss it.

If you believe this is wrong or have other ideas feel free to open a Github issue and we will go through it together.

Check them out and spread the word. We plan to make jsDelivr the best public CDN out there and we need your support for that.

  jsDelivr is an independent open-source project generously sponsored by MaxCDN. See what other projects we sponsor.
  • tomByrer

    ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js has been outdated for a year; that serves v1.9.1, while newest jQuery 1x branch is v1.11.0 However, cdn.jsdelivr.net/jquery/1/mainfile works great!
    I tried to tweet someone about this a few days ago *cough cough* ;)

    • Dmitriy A.

      Haha yeah, @jsdelivr is kinda abandoned.

      Btw I never intended for /mainfile URLs to be actually used, it was a byproduct of a different feature. I am curious if other people use them too.

      • tomByrer

        OOps, is it OK to use ‘/mainfile’ then?

        • Dmitriy A.

          Yeah, I just think it looks ugly :)

  • MilSF

    Been switching over a project that has lots of libs to your grouping URL strategy. The one thing that would be great is if there were actually two mainfile parameters. Many projects have both js and css required files such as alertify.js. Perhaps a different URL param like /gcss/ instead of /g/ when you want to pull the css mainfile.

Categories

Recent Posts

  • Now Serving: Hong Kong China
  • 5 Things you can do with our Raw Logs API
  • Happy 2nd Birthday BootstrapCDN
  • Now Shipping: MaxCLI > maxcurl
  • Now Serving: Tokyo Japan

Compare the speed of two websites in 5 seconds.

100% Free

Start Testing
TRUSTED BY