• Status: Solved
  • Priority: Medium
  • Security: Public
  • Views: 906
  • Last Modified:

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.
0
paulc2000
Asked:
paulc2000
  • 10
  • 8
1 Solution
 
CSecurityCommented:
in command write chmod 755 cache. Did  you tried 755 permission? Also do you have mod_rewrite installed and enabled on Apache?
0
 
paulc2000Author Commented:
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
0
 
CSecurityCommented:
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.
0
VIDEO: THE CONCERTO CLOUD FOR HEALTHCARE

Modern healthcare requires a modern cloud. View this brief video to understand how the Concerto Cloud for Healthcare can help your organization.

 
paulc2000Author Commented:
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

0
 
CSecurityCommented:
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.
0
 
paulc2000Author Commented:
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
0
 
CSecurityCommented:
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.
0
 
paulc2000Author Commented:
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
0
 
CSecurityCommented:
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.

0
 
paulc2000Author Commented:
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]
0
 
CSecurityCommented:
RewriteRule ^css/(.*\.css) /combine.php?type=css&files=$1

Is your combine.php is RIGHT after your homepage?

I mean yoursite.com/combine.php ??
0
 
paulc2000Author Commented:
Yes, combine.php is in the same directory as the homepage, at yoursite.com/combine.php
0
 
CSecurityCommented:
Could you temporarily remove all other stuff from .htaccess and just put rewrite rules for combine.php and see if it works?
0
 
paulc2000Author Commented:
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...
0
 
CSecurityCommented:
your css es are in css folder and javascripts are in javascript folder?
0
 
CSecurityCommented:
Give this a try also:

RewriteEngine on

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

Open in new window

0
 
paulc2000Author Commented:
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?
0
 
CSecurityCommented:
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
0

Featured Post

Free Tool: Port Scanner

Check which ports are open to the outside world. Helps make sure that your firewall rules are working as intended.

One of a set of tools we are providing to everyone as a way of saying thank you for being a part of the community.

  • 10
  • 8
Tackle projects and never again get stuck behind a technical roadblock.
Join Now