This repository is private.
All pages are served over SSL and all pushing and pulling is done over SSH.
No one may fork, clone, or view it unless they are added as a member.
Every repository with this icon (
) is private.
Every repository with this icon (
) is private.
This repository is public.
Anyone may fork, clone, or view it.
Every repository with this icon () is public.
Every repository with this icon (
) is public.
| name | age | message | |
|---|---|---|---|
 |
README | Sun Oct 11 11:53:14 -0700 2009 | |
 |
booster/ | Sun Oct 11 16:13:57 -0700 2009 | |
| |
examples/ | Sun Oct 11 16:13:57 -0700 2009 | |
| |
htaccess/ | Sun Oct 11 14:47:23 -0700 2009 | |
| |
license.txt | Tue Oct 06 04:07:10 -0700 2009 | |
| |
testcases/ | Sun Oct 11 11:18:13 -0700 2009 |
README
Copyright (C) 2009 Christian "Schepp" Schaefer http://twitter.com/derSchepp ---------------------------------------------------------------------------- Important notice ---------------------------------------------------------------------------- This piece of code has just been published so that others can start testing and/or using and/or enhancing it. I'd eat my hat if there aren't enough bugs left, especially regarding absolute/relative paths when linking and including and so on. That's what the testing is good for (and no, I don't wear no hat...) Not a bug is that I don't plan to support browsers older than IE6SP2. It's also not intended to minify or further compress (like with Dean Edwards packer) the JS, as I experienced a lot of trouble doing that. Also most large JS-libraries/frameworks are already heavily minified. ---------------------------------------------------------------------------- Functionality and Benefits ---------------------------------------------------------------------------- CSS-JS-Booster is a PHP-script that tries to automate as many performance optimizing steps related to CSS and JS embedding as possible. For CSS these steps are: - combine multiple CSS-files resulting in HTTP-requests going down - optimize and minify CSS with CSSTidy - Embed any CSS-images smaller 24KB as data-URI or MHTML (for IE <= 7) - Split the output back into 2 even files that can load in parallel - GZIP-compress the resulting CSS - Have browsers cache the result as long as it remains unchanged - If IE6: Issue a JS-command to fix background image caching behaviour For JS these steps are: - combine multiple JS-files resulting in HTTP-requests going down - GZIP-compress the resulting JS - Have browsers cache the result as long as it remains unchanged + GZIP-compress the page itself from where those files are called. Depending on the amount of CSS, CSS-images and JS, this can significantly increase loading speed of your site. Naah, your software stinks! Alternatives? Yes, there are! There is a nifty piece of software built by some smart people over in russia called "Web Optimizer" at http://www.web-optimizer.us/ that does what CSS-JS-Booster does, and a little lot more. And there are Wordpress and Joomla-Plugins. It is priced quite reasonable at $99. For any full-fledged web 3.0 company with money, their own servers and some technical skills (or instead: even more money), there also exists an enterprise-website-accelerator named "aptimize": http://www.aptimize.com/ Just to have mentioned those... ---------------------------------------------------------------------------- Basic Usage ---------------------------------------------------------------------------- CSS-JS-Booster is - as its name implies - divided into two function blocks: A CSS-optimizing block and a JavaScript-optimizing block. For both functionalities you first need to go into the booster-folder and create a folder named "booster_cache" and have it CHMOD 0777. Afterwards include <?php include('booster/booster_inc.php'); $booster = new Booster(); ?> at the top of your (PHP-interpreted) file. (Adjust the path according to your folder-structure) Should you happen to only have static HTML-files, try enabling PHP-parsing by putting a .htaccess-file into the site's root with following directive: AddType application/x-httpd-php .html .htm For the CSS-part, put all releveant CSS-files into a subfolder "css" of your site. Make sure, all declarations pointing to image-files have their paths adjusted (i.e. all CSS should be fully functional inside that folder). If you have multiple CSS-files rename them so that they are alphabetically sorted in the desired order, e.g.: 01_first.css 02_second.css 03_third.css Then add this declaration in the HTML's head-section: <?php $booster->css_dir = 'css'; echo $booster->css_markup(); ?> for example: <head> <title>Webpage</title> <?php $booster->css_dir = 'css'; echo $booster->css_markup(); ?> </head> The argument is the path relativ to the file calling that function. If you are in a subfolder it should read '../css'. For the JS-part, put all releveant JS-files into a subfolder "js" of your site. If you have multiple JS-files rename them so that they are alphabetically sorted in the desired order, e.g.: 01_first.js 02_second.js 03_third.js Then add this declaration either in the HTML's head-section, or - better for performance and therefore recommended when you experience no errors - right before the closing </body>: <?php $booster->js_dir = 'js'; echo $booster->js_markup(); ?> for example: <?php $booster->js_dir = 'js'; echo $booster->js_markup(); ?> </body> </html> The argument is the path relativ to the file calling that function. If you are in a subfolder it should read '../js'. ---------------------------------------------------------------------------- Q & A for Advanced Usage ---------------------------------------------------------------------------- Q: How can I combine files out of multiple CSS- or JS-folders? A: By setting as directory argument a comma delimited list of folders: $booster->css_dir = 'css_1,css_2'; echo $booster->css_markup(); or $booster->js_dir = 'js_1,js_2'; echo $booster->js_markup(); Q: For CSS, how can I define a different/specific target-medium? A: Yepp, by setting the desired media before echoing the markup: $booster->css_media = 'screen,projection'; echo $booster->css_markup(); Q: For CSS, can I define a second folder to feed an alternate stylesheet? A: Sure, e.g. like this: $booster->css_dir = 'css_2'; $booster->css_rel = 'alternate stylesheet'; $booster->css_title = 'Alternate Stylesheet'; echo $booster->css_markup(); Q: For CSS, can I influence in how many even parts it gets split? A: Nothing easier than this: $booster->css_totalparts = 4; echo $booster->css_markup(); Q: For JS, can I increase the number of parts it gets split into? A: Yes, by setting the second argument: $booster->js_totalparts = 2; echo $booster->js_markup(); Q: For CSS, can I have it output in HTML 4.01 fashion? A: No problem, do this: $booster->css_markuptype = 'HTML'; echo $booster->css_markup(); ---------------------------------------------------------------------------- .htaccess Acceleration ---------------------------------------------------------------------------- For an even further speed-boost, either add the contents of /htaccess/.htaccess to your existing .htaccess-file in your site's root, or the file itself shouldn't you have any .htaccess-file installed in your site's root yet. Should you happen to get internal server error 500s, then something went wrong with my .htaccess and you server-config. What the .htaccess adds: - Turns off ETags - Adds aggressive caching for all sort of assets like images/favicon/flash ---------------------------------------------------------------------------- Copyright and License Information for 3rd party elements used in the scripts ---------------------------------------------------------------------------- CSSTidy 1.3 is taken from here: http://csstidy.sourceforge.net/ You find its license inside booster's csstidy-1.3-folder Browser detection is done with Paul Scott's script taken from here: http://www.phpclasses.org/browse/file/12369.html ---------------------------------------------------------------------------- Copyright and License Information for 3rd party elements used in example1 ---------------------------------------------------------------------------- HTML and CSS Template named "Blog Division" is taken from here: http://www.free-css.com/free-css-templates/page1/blog-division.php You find its license inside example1's root-folder The Sansation Font is © 2008 Bernd Montag and taken from here: http://www.fontsquirrel.com/fonts/Sansation You find its license inside example1's js-folder cufón has its home here: http://github.com/sorccu/cufon You find its license inside example1's js-folder jQuery is taken from here: http://code.google.com/p/jqueryjs/ You find its license inside example1's js-folder
