asked on

Combine and compress JS and CSS

Hi all,

I have a large-ish number of CSS and JS files on my site. I found an interesting method of dealing with this problem (combine and compress files on the fly) at this page:

http://rakaz.nl/2006/12/make-your-pages-load-faster-by-combining-and-compressing-javascript-and-css-files.html

I've followed the instructions on the page, but for some reason, the /cache directory remains empty, so the script isn't working as it should. I figure this is something to do with a misconfigured htaccess file or the wrong permissions on the cache directory. But I've tried a pile of different things but none so far has worked - the cache remains empty.

Can anyone assist please? What permissions should I have on /cache? What should my htaccess file look like? (I already had rewrite and caching rules in the htaccess, so I wonder are these conflicting with the new rules that I had to add?)

Thanks,

Paul.

CSecurity

in command write chmod 755 cache. Did you tried 755 permission? Also do you have mod_rewrite installed and enabled on Apache?

paulc2000

ASKER

Thanks for your reply. I'm using Rackspace Cloud, so I don't have admin access to the Apache installation, but I can chmod and use htaccess.

I have functioning rewrite rules (301) set up in htaccess, so I guess that mod_rewrite is enabled?

I've also tried 755 on /cache and even 777 (briefly), but to no avail.

Is there anything else I can try?

Thanks

CSecurity

You need to do some debugging...

For example in combine.php add a code which writes a debug string like "Test" into a file when called. Then try to get a sample css file in your site, like yoursite.com/test.css

See if combine.php wrote Test string in where it supposed to be written. If not, you have something wrong in your .htaccess.

paulc2000

ASKER

Hi again. Sorry for the delay. I tried changing the caching directory to the web root (which is writable by other files), but still the cached files don't appear.

Do you have any suggestions as to how my htacess should look?

I've attached how it is currently.

Thanks,

Paul

php_flag zlib.output_compression On
php_value session.cache_expire 10800
php_value session.gc_maxlifetime 43200
php_value session.save_path /mnt/stor1-wc1-dfw1/385855/397366/www.xxxxxxx.com/sessions/
php_value session.gc_probability 1
php_value session.gc_divisor 100
RewriteEngine on
RewriteBase /
RewriteRule ^css/(.*\.css) /combine.php?type=css&files=$1
RewriteRule ^javascript/(.*\.js) /combine.php?type=javascript&files=$1
RewriteRule ^fr($|/) http://www.xxxxxxx.com/language-fr.php? [R=301,L]
RewriteRule ^de($|/) http://www.xxxxxxx.com/language-de.php? [R=301,L]
RewriteRule ^it($|/) http://www.xxxxxxx.com/language-it.php? [R=301,L]
RewriteRule ^es($|/) http://www.xxxxxxx.com/language-es.php? [R=301,L]
RewriteRule ^flash($|/) http://www.xxxxxxx.com/index.php? [R=301,L]
RewriteRule ^events($|/) http://www.xxxxxxx.com/index.php? [R=301,L]
Redirect /aboutus.php http://www.xxxxxxx.com/customer-service-details.php [R=301,L]
Redirect /contact.php http://www.xxxxxxx.com/contact-us.php [R=301,L]

# SET UP CACHING TO SPEED UP SITE
# 1 YEAR
<FilesMatch "\.(ico|pdf|flv)$">
Header set Cache-Control "max-age=29030400, public"
</FilesMatch>
# 1 MONTH
<FilesMatch "\.(jpg|jpeg|png|gif|swf)$">
Header set Cache-Control "max-age=2764800, public"
</FilesMatch>
# 1 MONTH
<FilesMatch "\.(xml|txt|css|js)$">
Header set Cache-Control "max-age=2764800, proxy-revalidate"
</FilesMatch>
# 1 MIN
<FilesMatch "\.(html|htm|php)$">
Header set Cache-Control "max-age=60, private, proxy-revalidate"
</FilesMatch>

## CSS Compression
RewriteCond %{HTTP:Accept-encoding} gzip
RewriteCond %{THE_REQUEST} ^(.*).css
RewriteCond %{SCRIPT_FILENAME}.gz -f
RewriteRule ^(.*)\.css $1.css.gz [L]

## JS Compression
RewriteCond %{HTTP:Accept-encoding} gzip
RewriteCond %{THE_REQUEST} ^(.*).js
RewriteCond %{SCRIPT_FILENAME}.gz -f
RewriteRule ^(.*)\.js $1.js.gz [L]

Open in new window

CSecurity

Seems OK, but try to add that debug code to see even 1 time your combine.php getting called or not?

If not called, your Rewrite engine doesn't work.

If called, now do this:

open this URL: http://www.yoursite.com/combine.php?type=javascript&files=somejsfile.js

replace somejsfile.js with a javascript file address you have, like admin/test.js

Then try it, if you still don't see anything in cache folder, your combine.php not works... Needs more debugging.

paulc2000

ASKER

Sorry, perhaps I should have mentioned that I had already checked to make sure that combine.php is called. I had it echo $cachedir, and it did, that was fine. Still, however, there are no compressed files anywhere.

Do you have any other ideas?

Thanks,

Paul

CSecurity

So code in your combine.php has bugs... Need to debug it. When you call it with parameters SIMPLY it should create cached file of file you are calling in cache folder.

paulc2000

ASKER

Agh! Annoying... I did as you said above, and went straight to http://www.yoursite.com/combine.php?type=javascript&files=somejsfile.js, and a compressed file appeared in the cache directory.

So, some progress. Now, why won't it work without going straight to that file? The htaccess is meant to rewrite all *.css and *.js calls...

I guess the htaccess is the problem? Any more ideas?

Thanks again

Paul

CSecurity

See I see you don't read my comments properly...

Only possible problems:

a) .htaccess file is not well written, like DocumentRoot or anything else...

b) Apache mod_rewrite doesn't work properly.

paulc2000

ASKER

Yes, I should have read your comments more thoroughly.

Please explain (a) - what makes it not well written?

(b) Why do the other rewrites work fine, such as:

RewriteRule ^fr($|/) http://www.xxxxxxx.com/language-fr.php? [R=301,L]
RewriteRule ^de($|/) http://www.xxxxxxx.com/language-de.php? [R=301,L]
RewriteRule ^it($|/) http://www.xxxxxxx.com/language-it.php? [R=301,L]
RewriteRule ^es($|/) http://www.xxxxxxx.com/language-es.php? [R=301,L]
RewriteRule ^flash($|/) http://www.xxxxxxx.com/index.php? [R=301,L]

CSecurity

RewriteRule ^css/(.*\.css) /combine.php?type=css&files=$1

Is your combine.php is RIGHT after your homepage?

I mean yoursite.com/combine.php ??

paulc2000

ASKER

Yes, combine.php is in the same directory as the homepage, at yoursite.com/combine.php

CSecurity

Could you temporarily remove all other stuff from .htaccess and just put rewrite rules for combine.php and see if it works?

paulc2000

ASKER

I took out everything except:

RewriteEngine on
RewriteBase /
RewriteRule ^css/(.*\.css) /combine.php?type=css&files=$1
RewriteRule ^javascript/(.*\.js) /combine.php?type=javascript&files=$1

...but still nothing... this is a strange one...

CSecurity

your css es are in css folder and javascripts are in javascript folder?

ASKER CERTIFIED SOLUTION

CSecurity

membership

This solution is only available to members.

To access this solution, you must be a member of Experts Exchange.

Start Free Trial

paulc2000

ASKER

I think I'm getting dumber...... Wrong directory names.....

So now it's outputting the compressed files ok, but I'm getting Javascript console errors.

I'm happy to close this question, as you deserve the points. Should I open another regarding the JS errors?

CSecurity

Yes, you can open new question with JS errors... If needed, post the link to new question here and I'll glad to help you on that too