This class is made by unreal4u (Camilo Sperberg). The original idea was to just put together all CSS's on a page in one place, but why not try to optimize a bit the CSS in that step? Finally, why not compress it and send an 304 Not Modified header to save some bandwidth?

I would also like to thank Jason Davis for his suggestion to print only the cache filename created by the class, that certainly opened some great posibilities! Thanks Jason!





define('CHARSET','UTF-8');             // The charset to use
define('OPTIMIZE_CSS',TRUE);           // Whether to strip the most common byte-eaters
define('USE_CSS_CACHE',TRUE);          // Whether to use internal cache
define('GZIP_CONTENTS',TRUE);          // Use TRUE only when the server doesn't compress CSS natively
define('GZIP_LEVEL',6);                // GZIP compression level, range from 1 to 9
define('CACHE_LOCATION','cache/');     // Cache location, WITH trailing slash, should be writable
define('USE_BROWSER_CACHE',TRUE);      // Whether to instruct the browser to save the CSS in cache
define('TIME_BROWSER_CACHE','3600');   // Time in seconds the browser caches our CSS


First of all, if you are not worried about bandwidth, it would be better to NOT implement this class. It would be faster if you just reference the CSS directly from the HTML.

But, if you are concerned with bandwidth usage, than this class is for you. It can take one or several CSS's, and make one big file of it/them. This will certainly reduce some HTTP requests.

It will also create a cache CSS on your server, because when it creates this cache, it will strip out all unnecesary spaces, such as \n, \r, \t, white spaces, and optionally it will try to do some optimizations:


There are some things that this package won't do for you:


Q: Use ETags?

A: Because Expires, Cache-Control and Last-Modified headers are far more standarized and they work well with every browser I know about. Besides, sending an ETag will require more processor time (generating the ETag) and also more bandwidth sending all the necesary headers. (Back and forth)

Q: Installed the ability to add CSS when you create the object?

A: Yes, it would have been nice to do that, but that would have meaned not to be able to add more CSS after that step.

Q: Made it compatible to work with JavaScript also?

A: JavaScript behaves completely different than CSS and is far more complicated than CSS. However, I am planning to make another class that does the same thing as this one, but with JavaScript files. Maybe, and only maybe, I could adapt this class to do that, but I'm not a JavaScript expert.

Q: What method do you suggest?

A: Without any doubt, use the internal cache and also the browser cache. I haven't benchmarked this class yet, but generating the first cache file should be the slowest method. Obviously, reading from the cache file or sending a simple 304 Not Modified header should be the fastests methods.

Q: What happens if I want to update the original CSS files?

A: That is one of the big advantages of this class: you can easily update your original CSS files with your favorite editor and whenever you update them, the class will update the internal cache file. When a client checks for a new CSS definition, the class will automaticly send him the last version. (Which happens whenever the client haves a different version of the internal CSS cache)

Q: Is it a good idea to update the cache file generated by this class?

A: Nopes... Whenever a change is detected in the original CSS files, the class will recreate the internal cache file, so any change you will make to the cache file and not the original files will be lost.

Q: When an error happens, how can I save it without messing up with the CSS output?

A: Saving it into a temporary file. Example:


if(isset($CSSErrors)) {
  $fp = fopen(CACHE_LOCATION.'css-problems.log','a');
  foreach($CSSErrors AS $e)
    fwrite($fp,$e['type'].' -- '.$e['errm']."\n");
This way you can save the CSS errors into css-problems.log