Hi all,

 

I'm trying to find out how I gzip my CSS and JavaScript files to improve the loading speed on my websites. Lots of sources are saying how great it is and yet I'm finding it to be quite unclear as to how I actually go about implementing this.

 

I have my own dedicated server so server limitations won't be a problem.

 

Does anyone know of any good step-by-step tutorials or instructions on how exactly I implement gzip compression to my website please?

Hi all,

 

I'm trying to find out how I gzip my CSS and JavaScript files to improve the loading speed on my websites. Lots of sources are saying how great it is and yet I'm finding it to be quite unclear as to how I actually go about implementing this.

 

I have my own dedicated server so server limitations won't be a problem.

 

Does anyone know of any good step-by-step tutorials or instructions on how exactly I implement gzip compression to my website please?

 

You could try this .htaccess snippet from CSS-Tricks

 

Active GZip Compression

 

However GZip would have to be installed on the server. Contact your host or check your CPanel to find out if it is.

You could try this .htaccess snippet from CSS-Tricks

 

Active GZip Compression

 

However GZip would have to be installed on the server. Contact your host or check your CPanel to find out if it is.

 

thanks for this!

 

So I put this in the .htaccess and then what?

thanks for this!

 

So I put this in the .htaccess and then what?

 

Then running the page through Page Speed or something similar would be good.

 

However ensuring the images you use are properly optimised is also a good method of reducing load time. I found a site not long ago that had a background image of nearly 2MB.

 

GZipping would be a tinkle in the ocean compared to a mere 50% reduction on that.

Then running the page through Page Speed or something similar would be good.

 

However ensuring the images you use are properly optimised is also a good method of reducing load time. I found a site not long ago that had a background image of nearly 2MB.

 

GZipping would be a tinkle in the ocean compared to a mere 50% reduction on that.

 

Thanks, I'm pretty clued up on all other areas of improving page loading - it's just gzip I'm looking to find out more about.

Thanks, I'm pretty clued up on all other areas of improving page loading - it's just gzip I'm looking to find out more about.

 

Try the GZip site then.

 

gzip.org

Hi all,

 

I'm trying to find out how I gzip my CSS and JavaScript files to improve the loading speed on my websites. Lots of sources are saying how great it is and yet I'm finding it to be quite unclear as to how I actually go about implementing this.

 

I have my own dedicated server so server limitations won't be a problem.

 

Does anyone know of any good step-by-step tutorials or instructions on how exactly I implement gzip compression to my website please?

 

Hi CAR

 

On the presumption that you are running apache and have either mod_deflate or mod_gzip enabled, simply place the below directly into your .htaccess file, upload and you should be good to go.

 

Hope this helps

Stuart

 

# If Apache has mod_gzip enabled zip up the following
<IfModule mod_gzip.c>
mod_gzip_static_suffix .gz
AddEncoding gzip .gz
AddEncoding gzip .gzip
mod_gzip_on YES
mod_gzip_handle_methods GET
mod_gzip_temp_dir /tmp
mod_gzip_can_negotiate Yes
mod_gzip_dechunk Yes
mod_gzip_send_vary On
mod_gzip_update_static No
mod_gzip_keep_workfiles No
mod_gzip_minimum_file_size 250
mod_gzip_maximum_file_size 1048576
mod_gzip_maximum_inmem_size 60000
mod_gzip_min_http 1000
mod_gzip_item_exclude reqheader "User-agent: Mozilla/4.0[678]"
mod_gzip_item_include file .js$
mod_gzip_item_include file .ico$
mod_gzip_item_include file .css$
mod_gzip_item_include mime ^application/pdf$
mod_gzip_item_include mime ^image/
mod_gzip_item_include mime ^application/x-javascript$
mod_gzip_item_include mime ^text/.*
mod_gzip_item_include file .html$
mod_gzip_item_include file .php$
mod_gzip_item_include file .pl$
mod_gzip_item_include file .cgi$
mod_gzip_item_include handler ^cgi-script$
mod_gzip_item_include mime ^httpd/unix-directory$
mod_gzip_item_include mime ^application/postscript$
</IfModule>

# If Apache has mod_deflate enabled zip up the following
<IfModule mod_deflate.c>
SetOutputFilter DEFLATE
SetEnvIfNoCase Request_URI \.(?:gif|jpe?g|png)$ \
	no-gzip dont-vary
SetEnvIfNoCase Request_URI \
	\.(?:exe|t?gz|zip|bz2|sit|rar)$ \
	no-gzip dont-vary
SetEnvIfNoCase Request_URI \.pdf$ no-gzip dont-vary	
BrowserMatch ^Mozilla/4 gzip-only-text/html
BrowserMatch ^Mozilla/4\.0[678] no-gzip
BrowserMatch \bMSIE !no-gzip !gzip-only-text/html
</IfModule>

# This bit of code if for page cacheing
# If Apache has mod_expires enabled cache the following
# Cache time and date can be adjusted as required
<IfModule mod_expires.c>
ExpiresActive On
AddType image/x-icon .ico
ExpiresByType text/html "access plus 120 seconds"
ExpiresByType text/plain "access plus 30 days"
ExpiresByType video/x-flv "access plus 1 month"
ExpiresByType image/gif "access plus 2 months"
ExpiresByType image/ico "access plus 2 month"
ExpiresByType image/jpeg "access plus 2 months"
ExpiresByType image/png "access plus 2 months"
ExpiresByType text/css "access plus 2 months"
ExpiresByType text/php "access plus 6 hours"
ExpiresByType image/x-icon "access plus 2 months"
ExpiresByType text/javascript "access plus 2 months"
ExpiresByType application/pdf "access plus 2 month"
   ExpiresByType application/x-javascript "access plus 2 week"
   ExpiresByType application/x-shockwave-flash "access plus 2 month"
</IfModule>

Here's another useful technique - SmartOptymizer.

great thanks guys, these are all very useful I will be sure to try out them out.

Hi

 

This is a great web site for compress css and js files using yahoo ui compressor: http://q.gs/OdDw click the button yellow on top.

 

Thank's.