What is the gain of "unifying" the .css and .js resources of a site?

Question

What is the gain of "unifying" the .css and .js resources of a site?

Navigation

#1 by (3 votes)

3

Scenario: A X site has 5 .css files and 5 .js files all with 5KB , a / strong> has the same HTML as the X site but its .css and .js resources are linked together (.js with .js and .css with .css) .

Question: What is the difference in loading time between the two pages (may be in percentage, gross, the goal is to see if there is a unify gain) resources and when the gain starts)? exists / what is the overhead of multiple connections for downloading .css and .js?

OBS: I take into consideration CSS for reset, CSS for external libraries,   General CSS and page-specific CSS, external libs JS, general and   page specifics.

OBS2: Based on Apache 2.4 but examples on other servers are welcome

javascript css apache

asked by anonymous 06.11.2015 / 15:35

1 answer

Using multi language in Wordpress Placing click event on the button that is in a Fragment, in an Activity?

score 3 · Accepted Answer

In the case where the files are together only a single request to the server is required to get the content. Furthermore file compression tends to work better than in the files separately. For this reason build generators such as Grunt or Gulp have options to merge the files, "mythologize" them, and compact them for better overall site performance.

On the other hand this should be checked by measuring for each specific site since JavaScript files, for example, can be loaded on demand as the page needs resources. For example, Asynchronous Module Definition (AMD) allows you to load only what is required for the initial page operation. As the user interacts with the page other features may be loading in the background giving the feeling of fluidity in the Visual Interface.

In short, there is no simple answer. The answer will depend on the problem being solved. If performance is critical then Benchmark testing is required.