Automatic minify and cache CSS

In my project CSS files can be pre-processed and then optionally minified (depending upon configuration).

Q1. Should multiple cache variations be generated for different combinations of CSS files?

res.php?stylesheets=test.css,test2.css,test3.css
res.php?stylesheets=test.css,test3.css

Q2. In the past I have noticed that such cache files were given some sort of GUID. How can I generate such an ID based upon the request?

res.php?stylesheets=test.css,test2.css,test3.css
  => cache/css/a3cadfeA33afADSFwwrzgnzzddsveraeAE
res.php?stylesheets=test.css,test3.css
  => cache/css/开发者_开发问答ergope4t5oiyk0sfb9x0fHkg04mm04tjzG

Please excuse the naivety of the above IDs!

Somehow I need to be able to regenerate the same ID from the stylesheets specified.

My question is only about caching of multiple variations and ID generation.

1. Yes, some pages will need different combinations of style sheets. Each combination must be cached individually. Unfortunately, the browser won't know that there isn't a difference between ?stylesheets=a.css,b.css and ?stylesheets=b.css,a.css so both will need to be cached.

2. That's used to make sure the browser doesn't accidentally cache the dynamically generated stylesheet. It's unnecessary if you are using a decent minifier. Usually, the GUID is found by hashing the last-modified times of each file in the list. Like I said, most minifiers will automatically check for new versions of files and discard the old cached version.

I would suggest PHP Minify. Installation is as easy as copying the folder into your doc root. It also supports JavaScript compression with the Google Closure Compiler.

A1: Yes i think the best solution is to generate one for every combination. BUt you can cache every file separate and combine them but i think its faster when you cache them together. A2: You can calculate the GUID/Hash/etc. from the checksumes of the files. like:

sha1( sha1(file1) + sha(file2) .......)

A good idea is to cache this id generation, too with a very short ttl.

This simple implementation has some interesting functions like Etag generation: http://rakaz.nl/projects/combine/combine.phps

Assetic seems to be good at making assets of JS/CSS and minify them while putting them in cache.

For your first question, I would just minify all your (often used) CSS files together into one file and not bother with all possible combinations. That way, every subsequent request can simply use the same CSS file from the local cache instead of fetching a different minified file based on whatever combination is required. Use proper ID and class names to ensure that you don't get style collissions when it all ends up in one file.

As for you second question, this is usually done through some sort of build system (e.g. the same system that you call the CSS minifier from). Each time the CSS files are rebuilt, a build num,ber of version number is generated (could be just incremental, could be the md5 hash of the file) which is then used by your application in the generated stylesheet link urls.

Do look at https://github.com/web-developer/Resource-Handler. This allows you to merege all your css into 1. It also does compress, minify and even cache your css. It also works for your js. This requires least configuration or hassle, unlike some of the other ones suggested .

RESOURCE HANDLER