Should I seperate CSS Files?
whats the best solution when using clean css. I have 1 page of html which consists of 6 sections.
should I seperate the css files on each section? or should I just put it all the css in one file.css?
6 Replies
I would suggest a single CSS file, otherwise your single page will have to download 6 different CSS files which is only going to slow it down and make life harder for you as you have to maintain 6 different files.
This is true but you can also use Sass partials to compile different partials into one stylesheet so that's an option
In my experience, the best way to separate your css is up to you and your workflow. Find a style that works for you and run with it
Thats true. As @sebin9528 didn't mention a framework I just assumed (probably a mistake on my part) that they were just using vanilla HTML and CSS.
Thanks guys!
Unknown User•2y ago
Message Not Public
Sign In & Join Server To View
@import in regular CSS is basically the worst thing you can do from a performance perspective
You'd be better of just linking to multiple files if you really wanted to have multiple files.
The issue with @import is it has to download the first file, before it realizes it needs to download another file, and because of the nature of CSS, it becomes sequential... and CSS is render blocking...
So what happens is the main CSS file is downloaded and the browser starts to parse it, but the first thing it sees is an @import, so it downloads that file (all the while, nothing else is going on), and parses that file.
Then back int he main file, on line 2, there is another @import, so off we go again with that one, and so on.
---
If you really like the idea of having many files, but don't really want to get into Sass, PostCSS supports partial files out of the box (using @import) and will merge them all when you build. Probably the easiest way to add that to your workflow.