Page 1 of 1

css compression

Posted: Sun Feb 14, 2010 12:20 pm
by steph_30
Hi all,

Like a lot of web site maker, I'm trying to accelerate the page load time ...
I'm using the 1.6.6 CMS version and try to accelerate using the Yslow firefox plugin indications.

It said me that the css were not compressed ... so I searched for solutions with google informations.
I found some solutions with htaccess modifications. I tried them, but no success according to the host apache configuration (header module not loaded ...).

So I tried to change the way the css were send. I found that in stylesheet.php, css are compressed according to the config point "output_compression". I tried to put it on true, but, no success because of apache configuration (php / html file are compress with apache so I can't add one compression level ...). So I receive a error 500 for my page.

So I tried to add code (in stylesheet.php) just before the "echo $css;", and it worked

Code: Select all

header('Etag: "'.$etag.'"');
// NEW--------------
if (substr_count($_SERVER['HTTP_ACCEPT_ENCODING'], 'gzip'))
{
	ob_start("ob_gzhandler");
	header("Content-Encoding: gzip");
}
else
{
	ob_start();
}
// END NEW ---------
echo $css;

// EOF
?>
I'm not very happy to change the CMS core, but it resolved my problems.

I don't really understand why it is not automatically compress with apache module  :perhaps because of the request that is a text/css one and apache only compresses text/html ones.

I was thinking about the fact of adding a config point for the css like "css_output_compression".
And why not making the same for js files that could be link to a page or a template and so could have dedicated file to send them.


If someone could try this and tell me if it work on his host ....


Thanks

Stephane

Re: css compression

Posted: Sun Feb 14, 2010 2:53 pm
by replytomk3
No. There are online services available that will compress your CSS on their website. You would then use that stylesheet instead. You will also combine the many stylesheets into one compressed file.

To see an example, view the stylesheet of meetup.com with the Web Developer toolbar.

Re: css compression

Posted: Sun Feb 14, 2010 3:34 pm
by steph_30
Thanks for the answer.

I know the css compression tools. I will make a try for my css.

I tried on the meetup.com and get the meetup.css : 35Ko (according to yslow).
When I looked at your css, its weight is 179 Ko, so the content is zipped on the server and send to the client.
This zip is automatic for your server, so it will not work correctly if you compress it a second time.

For my host, the css are not automatically compressed, that's why I was seaching for a compress method (not using htaccess).

My CSS is not actually compress (so it is human visible), but its weight is 20 Ko. With the technic I gave, the Css that is send to the client is compress and its weight is around 3 Ko.

Thanks again

Re: css compression

Posted: Sun Feb 14, 2010 3:55 pm
by JeremyBASS
Take a look at ScriptDeploy... it'll also take care of JS along with the CSS, and if you'r after an A in yslow and you may like it.. I'm almost ready to make a new realase here as welll .... HTH -J

Re: css compression

Posted: Sun Feb 14, 2010 4:52 pm
by steph_30
Thanks Jeremy

I made a try of ScriptDeploy ...

It seems that it can be my solution, but ...

I had something strange :
  •  I made a script within ScriptDeploy : JS and the target is lig/prototype.js.
  •  I made a group for my css'
  •  I made a script with one css (for the moment) and put it in the group.
  •  I put the correct calls to ScriptDeploy in the template ({cms_module module=ScriptDeploy groupID="1"} ...)
Yslow said me that all was gzipped ... cool

But, I lost my background-image (it's OK because I only paste the actual css into scriptDeploy so the paths are not good), so I suppress the call to the css group (just to see the js action).
And then, yslow told me that the scriptID-1/1.js was not gzipped !!!

I will continue to explore this solution and will come back


Thanks

Stephane

Re: css compression

Posted: Sun Feb 14, 2010 5:51 pm
by JeremyBASS
Well, to me gzipping is only half of the solution which minification is the other.  It's a compression as well, and can sometimes bring more savings then gzipping. That is what ScriptDeploy does to your css without you losing the comments and giving you smarty processing... you can and should turn gzipping on at the server root level, but you can also turn it on in the .htaccess file to level that back out plus if it's at the lower level you get the http doc gzipped as well.  There are other things you can do… there is a subdomain over ride as well...

I'm pushing out a new version here soon too, but I'll take a look.. I may be able to do something but it'll still better to use a different measure to try gzipping, best being adjust your server.

Hope this helps,
Cheers
Jeremy