Would it be wise to combine all CSS into a single file? Would there be any performance increase. I have to assume that an HTTP request is made to get each file on initial page load, and reducing those requests would seem to make sense.
Are there any reasons NOT to combine all css into a single file?(such as maintainability or other performance issue)
Many developers recommend avoiding inline CSS at all, as it usually can't be cached, and it's recommended to avoid splitting CSS across multiple files. At the very least, it should be used sparingly.
It depends on your use case. Usually everyone just smash a single css into the page and load it everywhere. If the site small and the css is only a few kB should be fine. once you get to the 100kb+ u probably better sppliting files into the most critical css and fonts so the first content is available without delays.
Before we get into what inlining CSS means and how to do it, it's important to first understand how CSS can affect performance. While JavaScript and images generally play a much larger role in negatively impacting performance metrics, CSS can also play a significant role.
you should keep only one css file. Let me tell you in simple one line, once your website loads in client web browser the static resource can be cached that helped your website to boost and number of web request can be reduce when user browse multiple pages of your website. Save this answer.
Merging all of your css files into one will absolutely gain performance. Whether that performance is noticeable depends on your load, number of requests etc. For the average blog, this will have close to zero impact.
Read Best practices for speeding up your web site at Yahoo! Developer. It'll explain things way better than i can.
As you say, a reason not to merge css files is for maintainability. However, there are many tools out there which automatically merge and minify your css files into one.
You should check out YUI Compressor, this will help you with merging and minifing your css files.
Would it be wise to combine all CSS into a single file? Would there be any performance increase. I have to assume that an HTTP request is made to get each file on initial page load, and reducing those requests would seem to make sense.
Yes, but make the combination at build or runtime and don't try to maintain a single file if you started with multiple ones.
In addition to the number of HTTP requests it is also important to set the right expiration headers in the response.
Are there any reasons NOT to combine all css into a single file?(such as maintainability or other performance issue)
It is not necessary to maintain a single file, but good to serve a single file, because CSS data is anyway merged.
The YUI Compressor is a good tool for JavaScript and CSS minification.
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With