CSS Caching and User-Customized CSS - Any Suggestions?

Question

I'm just trying to figure out the best approach here... my consideration is that I'd like my users to be able to customize the colors of certain elements on the page. These are not pre-made css they can choose from, but rather styles that can be edited using javascript to change the style, so they cannot be "pre-made" into separate style sheets. I am also generating the css into a cache directory since I am generating the css through a PHP script.

I am thinking that, perhaps I should:

1) If cached css file doesn't exist, create css file using the website default style settings.

2) If cached css file does exist, check if user has custom settings, if so, edit the cache file before displaying it.

Btw, when I refer to "cached file" I mean the PHP generated css document.

My goal is to prevent the need to have PHP re-generate the css file each time, whilst still allowing users, when logged in, to have their customized css settings applied. I will store these settings in a database most likely so when they return it is saved for them when they login.

Answer 1

Why not insert the customizations as inline CSS, that way it will surely override and caching will not be an issues.

Answer 2

If you store the setting in a DB, PHP will have for sure to do something anyway because only PHP (I mean server side script) can get data from the DB. So at such point I wouldn't mind to let PHP also write down the CSS part specific for the customers inside the CSS file or if it's a small part that simply chaNges some of the many styles PHP could write them directly into the head section of the HTML pages.

If you want to do everything via JS without using PHP at all, you could store the CSS preferences in cookies, but if user cleans up his browser's cache he will loose all his styles preferences.