CDN vs. join JS/CSS

Asked

Viewed 660 times

9

Among the performance recommendations of a web system are:

  • Use CDN (in case of jQuery, Bootstrap, etc)
  • Join JS and CSS to decrease the number of requests

Turns out those two rules go against each other. If I use jQuery and Bootstrap CDN, for example, I will be increasing the number of requests. On the other hand, if I join jQuery and Bootstrap into a single JS and CSS, I’ll be decreasing the number of requests, but I won’t be using CDN.

This way I would like to know in which situations each of the two alternatives provides me the best performance.

performance web-application cdn

2 answers

9

The solution depends on your scenario.

Be guided by the amount of files your application uses. If your pages use many files (i.e., many requests are made), it tends to be more advantageous to keep the bundling (merge the files). Otherwise it will be more advantageous to use only one CDN even.

But nothing prevents combining solutions. It is very common to use CDN for libraries outskirts (like jQuery and Bootstrap) "unlocking" your server and taking advantage of the browser cache and using the bundling for your various own files (internal files as it were).

  • About the second paragraph: Based on what you say that if I have many files I should join them and if I have few it is better to use CDN?

  • In any case it is good to use CDN. This helps in performance and SEO.

7


If I use jQuery and Bootstrap CDN, for example, I will be increasing the number of requests

It’s not like that.

First, the request will only be made once and then the browser will cache the script.

Second, if the user has already accessed another site that uses the same CDN and the same version of jQuery, there will be no request.

In general, it is worth joining only those dozens of jQuery plugins that you use, plus the particular scripts of the application or website.

But consider that there is no definitive answer that will be better for all cases. It would be more a question of probability.

  • The browser does not make a request to the server asking if that file has been modified? This "error" 304: http://www.checkupdown.com/status/E304.html

  • Not always. If an expiration date has been set it will not check. See item 5.3 of this page.

  • @Besides, I just accessed the jQuery CDN monitoring the header and found this: expires:Fri, 12 Jun 2015 09:58:11 GMT. In theory, the browser will use directly from the cache for one year.

  • Interesting. Still, I can activate this expiration date feature on my server, right? The downside would be not taking advantage of cache other websites if the user is accessing for the first time.

  • @Andrey Yes, it’s perfectly possible. The whole point is that you will bring more complexity to manage while you could delegate it. On the other hand, using CDN most of the time will bring a very small gain. Unless you really have server congestion, you may never have to worry about it.

Browser other questions tagged performance web-application cdn

You are not signed in. Login or sign up in order to post.