1

I've compressed JavaScript and CSS files using gzip. The JS files are already minified before it compressed with gzip cmd.

Now I need to tell apache to serve gzipped version of those files, if the browsers are compatible. For that I've added few lines of code in htaccess like this: 

AddType "text/javascript" .gz
AddType "text/css" .gz
AddEncoding gzip .gz

RewriteCond %{REQUEST_FILENAME} \.(js|css)$
RewriteCond %{HTTP:Accept-encoding} gzip
RewriteCond %{HTTP_USER_AGENT} !Safari
RewriteCond %{REQUEST_FILENAME}.gz -f
RewriteRule ^(.*)$ /$1.gz [QSA,L]

<FilesMatch .*\.js.gz$>
ForceType text/javascript
Header set Content-Encoding: gzip
</FilesMatch>
<FilesMatch .*\.css.gz$>
ForceType text/css
Header set Content-Encoding: gzip
</FilesMatch>

And the directory structure for the files inside public_html as follows: 

css/style.css
css/style.css.gz
js/customjsfn.min.js
js/customjsfn.min.js.gz
js/jquery.js
js/jquery.js.gz

In header I've included the css & js files like this: 

<link rel="stylesheet" href="http://example.com/css/style.css" />  
<script type="text/javascript" src="http://example.com/js/customjsfn.min.js"></script>
<script type="text/javascript" src="http://example.com/js/jquery.min.js"></script>

The styles are not applied properly. When I checked the response code using firebug, it returns 404 for my files.

Where I'm going wrong?

Braiam
  • 1
  • 11
  • 47
  • 78
vkGunasekaran
  • 6,668
  • 7
  • 50
  • 59
  • do you have deflate module? is your php ini configured correctly (if using that)? – Barry Chapman Feb 10 '12 at 11:26
  • 1
    Your web server should be configured to do this automatically. Are you sure this is necessary? Can you talk to the server admin? – Pekka Feb 10 '12 at 11:27
  • how can i check our server configured to do this? – vkGunasekaran Feb 10 '12 at 11:28
  • @Sekar the easiest way may be asking the server's administrator. Or look at the headers of any CSS or JS resource using a tool like Firebug – Pekka Feb 10 '12 at 11:42
  • possible duplicate of [How can I pre-compress files with mod_deflate in Apache 2.x?](http://stackoverflow.com/questions/75482/how-can-i-pre-compress-files-with-mod-deflate-in-apache-2-x) – Gumbo Feb 10 '12 at 11:59

2 Answers2

2

Shouldn't this suffice?

<IfModule mod_deflate.c>
  AddOutputFilterByType DEFLATE text/html text/xml application/xml text/css text/plain text/javascript application/x-javascript application/json
</IfModule>
rodneyrehm
  • 13,442
  • 1
  • 40
  • 56
  • because i'm having javascript files inside js folder & css are css/ folder, i modified the request condition like this, RewriteCond %{REQUEST_FILENAME} \js/.js$ RewriteCond %{REQUEST_FILENAME} \css/.css$ and it worked. but how can i check only the gzipped version is served? – vkGunasekaran Feb 10 '12 at 11:42
  • @Sekar - trust me, you are taking a very long approach to this. It is very simple, you do not need the extra steps you are taking. It is extra, unnecessary work for you. As far as seeing if they are compressed, try inspecting your headers. Do you have a URL? I can let you know if they are gzipped or not. – Barry Chapman Feb 10 '12 at 11:46
1

Nevermind you are doing this completely wrong. (I think, unless this actually is a legitimate way of doing this).

You should not be creating gzipped alternate assets. The webserver (apache) will compress them for you automatically. You do not need to redirect the user to gzipped assets.

Just add the deflate module as Rodneyrehm said, and it will handle the rest. That is probably why you are getting the 404 error. Don't create javascript.js.gz files.

See this:

AddOutputFilterByType DEFLATE text/html text/plain text/xml text/css text/javascript application/javascript application/x-javascript
BrowserMatch ^Mozilla/4 gzip-only-text/html
BrowserMatch ^Mozilla/4\.0[678] no-gzip
BrowserMatch \bMSIE !no-gzip !gzip-only-text/html
Barry Chapman
  • 6,690
  • 3
  • 36
  • 64
  • Remove all the htaccess entries you have for gzipping already and start over. You are taking a wrong/very-roundabout approach to a very simple process. – Barry Chapman Feb 10 '12 at 11:43
  • Thanks Barry, that's the way to go. I did as said by rodneyrehm.i checked response header using firebug i can see the content-encoding as gzip. so i don't need recompress the js files if i edited any code in that.. – vkGunasekaran Feb 10 '12 at 12:38
  • Personally, I still wouldn't do the manual Gzipping yourself. Just let the server encode the js files when it gets sent to the browser. – Barry Chapman Feb 10 '12 at 12:39
  • But i heard safari doesn't support gzip, is there any solution for this? – vkGunasekaran Feb 10 '12 at 12:41
  • yes... now i removed all the compressed versions. because it doubles my work when i do any changes in css/js. – vkGunasekaran Feb 10 '12 at 12:42