CSS Joiner: realtime CSS optimizer
Current version: 1.0
Author: Pavel Tzonkov
License: LGPLv2
Copyright ©2010 CSS Joiner Project
Contents
Overview
CSS Joiner is a realtime CSS optimizer, you may use in your web site/application to minimize CSS code returned from your web server. Multiple local or external files can be loaded just like single CSS file - using single <link> tag (one server request). Caching system is available for faster responses - generate and save compressed CSS code once, until change in source CSS files is done.
Features
- Load multile CSS files in single <link> tag.
- Transform url() paths of external CSS files.
- If source CSS files are not provided, CSS Joiner will parse all CSS files in the script's directory.
- Parse only new requests or/and modified CSS files, and return compressed content from cache.
- Browser-side cache.
- HTTP referer protection to avoid external use.
Compatibality
- CSS Joiner is tested on Apache 2 web server on Linux only. Probably it will works on other web servers and operating systems.
- mod_rewrite Apache module is optioanl requirement for non-parameter URLs.
- PHP5 is required. For loading external CSS files, allow_url_fopen ini setting should be enabled.
- To work properly, url() paths in source CSS files should be URL-encoded according RFC1738. If your source CSS files does not contain special characters in url() paths, you may skip this warning.
Demo
Enter URL paths to source CSS files you want to parse. Please type each URL in single line:
Link tag:
Uncompressed code:
Compressed code:
Download
Last version changelog
Version 1.0 - May 15, 2010
- It's first public version!
Installation
For security reasons local files with .css extension only can be parsed. By default it's valid rule for external files. There are several external files settings defined and described in index.php file.
To parse all .css files in a directory in your site (e.g. /css):
- Upload index.php from CSS Joiner package to /css.
- Create /css/cache directory writable for the web server.
- In <head> tag create <link> tag pointed to /css directory URL. Example:
<link href="/css/" rel="stylesheet" type="text/css" />
The files will be parsed in alphabetical order. You may rename CSS files for wished parse order. For example you can add numbers at the beginning of the file names.
For selective files parsing you may add to href attribute css[] GET parameters pointed to CSS files you want to parse. It's recommended to URL-encode these parameters. Example:
/css/?css[]=common.css&css[]=%2Fapp%2Fstyle.css&css[]=%2Fnew_css&css[]=http%3A%2F%2Fexternal.site.com%2Fstyle.css
This example will parse folowing files if they exists and can be read in order they arranged in the URL:
- /css/common.css - if not exists CSS Joiner will try to parse /common.css
- /app/style.css - a file outside /css directory
- /new_css - all .css files in /new_css directory in alphabetical order (works only for local files)
- http://external.site.com/style.css - will be parsed only if allow_url_fopen PHP ini setting is enabled
If you want to use mod_rewrite URL style, you should upload .htaccess from CSS Joiner package to /css. The parsed CSS URL should be transformed to:
/css/common.css../app/style.css../new_css..http://external.site.com/style.css
The files are separated by .. delimiter. You may change the delimiter editing /css/index.php. At the beginning of the file there are several configurable options defined as protected fields with commented descriptions.