Load files from one CDN or multiple CDNS
I'm afraid there is no silver bullet answer to this question as it usually happens. Here are my 2 cents. In oppose to focusing on the amount of simultaneous connections and browsers/standards I want to look at it from a different perspective.
What matters most for both your users and your server is page load time and service availability. Fastest load time is load from cache. The more of your users use specific file from a particular CDN, the more chances of the cache hit.
Based on this goal, it makes sense to
- Load popular libraries from popular CDN(s), which depends on the library list can be the same CDN or different CDNs. I would argue, that number of parallel HTTP connections of a browser is secondary argument.
- Join and minimise custom scripts and rarely used 3rd party libraries into as few files as make sense (for example single CSS and single JS) and load from your own host or own CDN (if you have tons of users coming from different locations or even continents CDN is probably isn't luxury for you).
- If CDN-based scripts were not loaded from CDN for whatever reason, fallback to a local copy.
- Should you have that option, select most used version of the libraries, which most likely is not the latest one.
I would categorize libraries for which you can find CDNs and statistics of usage to be popular, others - not so much, although you can decide for yourself what to host locally based on other recommendations.
For statistics, you may want to use something like w3techs:
- jQuery
- AngularJS
- Bootstrap
Picking between "few high traffic" and "many low traffic" sites could be done based on some educated guess about your web site audience, but if you want to make sure, you can try to measure cache hit ratio. It's not straightforward, but here us some idea.
Now, for the versions, should you have an option to change the versions. If you decide to go with the first option "few high traffic" sites, it's definitely worth checking which version of the library from the CDN they use. Otherwise, for "many low traffic" option, the most popular version is preferable. Same w3tech should have statistics.
It might sound like a lot of trouble, but it's done rarely (if not once), since statistics tend to change quite slowly.
In terms of using one or multiple CDN, it wouldn't be an issue depending on how many components you are downloading from the same hostname, according to this article from Yahoo UI Team, HTTP/1.1 suggests that browsers should limit parallel downloads to two per hostname. Therefore, using multiple CDN sources, it is, different hostnames should be a good practice.
Maybe in case of using related components just to avoid accidentally version mismatch like angular and angular-router for example, you might want to use the same CDN, but, if the download per hostname increases it would create loading leaks the same way (at least for browsers that follows the spec suggestion).
Using a CDN is definitely a good practice to increase loading performance of your web site. However, you should consider using the more popular CDNs you can find, it would increase the chances you get a cached version of the files you are using from a different site that uses the same file, which would increase even more the loading performance of the website.
As @JeffPuckett pointed out in the comments, browsers have a higher limit of simultaneous download per server/proxy today's days:
Firefox 2: 2 Firefox 3+: 6 Opera 9.26: 4 Opera 12: 6 Safari 3: 4 Safari 5: 6 IE 7: 2 IE 8: 6 IE 10: 8 Chrome: 6
Ref.: https://stackoverflow.com/a/985704/4488121