When adding CSS to a CMS dynamically should I write it to the DB or to file

Question

I a working on a CMS and I want to be able to add CSS via the administrative control panel.

When I add css should I just append it to the bottom of the stylesheet I have or is it best to add the data to a DB and then get it using a handler.

The way I see it they both seem to have advantages.

writing to file:
It is simple and requires very little code
The file is portable and can be copied like any other css file

writing to a DB:
I have more control
I can load only the classes I need for each document

Answer 1

I would amend the CSS file itself. Having dynamic CSS across the site will cause you issues as the style sheet will get cached, so it's better to put all of the style into the file and allow local caching to speed up the page than try to make lots of small CSS files.

There would be no harm in storing each rule in a database and using that information to create the .css file - it would be easier than parsing the string in the CSS file and finding an insert point, but make sure you just write the CSS file when there is a change. If you do it on demand, you'll be needlessly hitting your database constantly.

Answer 2

The biggest danger with appending the styles to the existing CSS is that if a browser has cached a version of the file, they will not see the updated styles untill the browser refreshes it's cache.

One way around that is to include a version string somewhere in call to the style sheet (for example (from SO)):

<link rel="stylesheet" href="/Content/all.min.css?v=2644">

However, this means that you'll also have to update the calls to the file each time you make the change, which may not possible.

That said, this is probably the route I'd take if I was going to be adding styles that often that uploading a new version of the stylesheet wasn't an option.

Answer 3

Having done both in previous lives, I think the answer depends on who is maintaining the CSS.

If it is a simple-interface for a non-technical user to manage a few simple styles, I would store this in the database, but as structured data, not raw CSS, and generate the CSS itself at run time. However as Sohnee mentions, you need to ensure it is not generated for every request, as this would be an unnecessary overhead - you should generate to a flat file, or cache effectively.

If it is an interface for a web-developer type person, who understands the concepts of files, and you want to give them full access to write any css they like (and you trust them!) then I would store it as a file (if I were the developer, I would want it to be using my raw CSS). However, I would not append it to the existing stylesheet (assuming that is the default base set of styles for the site) I would have a separate stylesheet for user-defined styles, called in the page with a separate link tag. This will keep the site 'code' separate from its 'content'. Note also what Zhaph - Ben Duguid says here about ensuring the browser does not cache old versions by adding some sort of version parameter to the URL.

writing to a DB: I have more control I can load only the classes I need for each document

I'd say only loading the classes per document would generally be a bad idea. Browsers are tuned for CSS caching, so you nearly always will be better off calling all your CSS from external files, with the appropriate caching headers.