CODEWITHSUNDEEP
css
asdasdasdasdqwe
asdasdasdasdqwe

Reputation: 331

css best practices - combining all css into a single stylesheet?

I read somewhere that -

You should put all CSS (files) into one single stylesheet

Question -

1) Is it good practice? if yes, then why?

Upvotes: 1

Views: 4114

Answers (4)

Sarfraz
Sarfraz

Reputation: 382909

Is it good practice? if yes, then why?

Because with one css file, browser sends one http request, with multiple css file browsers sends multiple http requests causing slow response to user.

This is also mentioned in Yahoo's famous:

Exceptional Performance

Check out:

Rule 1 – Make Fewer HTTP Requests

BTW, same goes true for Javascript (combine all in one) and images (use css sprites and single image)

Interesting:

There are two tools that can tell you how to speed up the page's speed:

Upvotes: 4

Marty
Marty

Reputation: 39466

You should combine all your CSS into one file to reduce the amount of requests made to your server.

A similar topic is sprite sheets, the combination of multiple images into one large image to also reduce the amount of requests made to your server.

You'll find that loading 100x 5kb files is a lot slower than loading a single 500kb file.

When you're ready to upload your files to a live environment, you should also consider compressing your CSS and JavaScript files. There are a vast amount of online tools for this, eg:

Upvotes: 4

David Garcia
David Garcia

Reputation: 2696

Because load time is an issue, and the more css files your website is requesting, the slower it runs.

Upvotes: 1

wasimbhalli
wasimbhalli

Reputation: 5242

You should bundle all your JavaScript in single file and your css in another single file. The benefit of having all your code in single file is less http requests on server and so the server can serve more users.

At development time, its good to keep things separate for management but for deploying you can use tools that automatically minify and bundle your JS and css files.

Upvotes: 0

Related Questions