CODEWITHSUNDEEP
javascriptperformance
zaphod
zaphod

Reputation: 2095

Page performance: To load multiple library scripts from CDN or combine and minify those libraries into one download from server?

I understand the advantages of loading big and common libraries like jQuery from CDN.

But what about the smaller plugins and library helpers like jQuery-ui or bootstrap and its helpers. My site has about 10-12 of those.

Should I pick each of them individually from cdnjs and get the CDN benefits, but potentially have many more HttpRequests. Or should I locally compress and minimize them into one big plugins file and load from my server?

I see this question on SO framed as "Multiple libraries off a public CDN or one concatenated file on our CDN", but what if we don't subscribe to a CDN?

Upvotes: 3

Views: 747

Answers (2)

Francisco Goldenstein
Francisco Goldenstein

Reputation: 13767

The good thing about using CDN is that the user gets the file from the closest CDN. Also, it's probable that the user already has that file on his computer so he doesn't need to download it.

Creating bundles will minimize the amount of GETs the browser needs in order to get all the scripts/styles.

My recommendation is to use a combination of both because browsers can only download 5 files at the time. So, use CDNs for the most common libraries (the user probably already have them) and use bundles for your own files (your stylesheets or your JS files).

Check the network tab in Developer Tools measure the time it takes in each case.

Upvotes: 2

Chavdar Slavov
Chavdar Slavov

Reputation: 875

I'll definitely advice to use what you can from cdnjs and similar CDNs. Most of the time people will have the files cached so there will be no additional HTTP requests.
Concatenating and magnifying everything that you can not load form CDN will save you some bandwidth and speed the loading time of your site.

Upvotes: 1

Related Questions