Question

I created a site using CodeIgniter, all is well. I tested the performance of my site using YSlow (Google Chrome App), and some of the results were graded A. However, I have a F grade in this area "Compress components using gzip". It pertains to my css and js files, most were found in <head>. I am not that advance so that's why I don't have an idea how to address this.

Was it helpful?

Solution

You can find the answer to that in the documentation: http://developer.yahoo.com/performance/rules.html#gzip

But, in a nutshell, to save time sending data across a network, you compress it in your web server, and then uncompress it in the web browser. Note that these functions are prporeties of the web server (Apache / IIS) and web browser (IE, Chrome, Firefox) and NOT properties at the application level. In otherwords, you can't fix it in Code Igniter. Here's the docs for apache, but if you're in IIS then you can do similar.

You can still optimise your JS and CSS files by compressing them without adjusting anything on the web server - they still end up as plain text but you shorten variable names, remove newlines and so on. Here is Yahoo's tools for reducing file size where you probably should start. There's also an on-the-fly mod just released for Apache (by Google) that you could use.

OTHER TIPS

You can use .htaccess file to compress your output. For that you need to enable apaches deflate module turned on. if you are using wamp then click the wamp icon on system tray. now go to apache -> modules. Now turn on headers module & deflate module. Now on your .htaccess file place the following code.

# compress text, html, javascript, css, xml:

AddOutputFilterByType DEFLATE text/plain
AddOutputFilterByType DEFLATE text/html
AddOutputFilterByType DEFLATE text/xml
AddOutputFilterByType DEFLATE text/css
AddOutputFilterByType DEFLATE application/xml
AddOutputFilterByType DEFLATE application/xhtml+xml
AddOutputFilterByType DEFLATE application/rss+xml
AddOutputFilterByType DEFLATE application/javascript
AddOutputFilterByType DEFLATE application/x-javascript
AddOutputFilterByType DEFLATE image/jpeg
AddOutputFilterByType DEFLATE image/png
AddOutputFilterByType DEFLATE image/gif

#Custom Setting End

You can achieve this by setting compress_output key in config file to true. I have copied this text from ./application/config/config.php file

Enables Gzip output compression for faster page loads. When enabled, | the output class will test whether your server supports Gzip. | Even if it does, however, not all browsers support compression | so enable only if you are reasonably sure your visitors can handle it. | | VERY IMPORTANT: If you are getting a blank page when compression is enabled it | means you are prematurely outputting something to your browser. It could | even be a line of whitespace at the end of one of your scripts. For | compression to work, nothing can be sent before the output buffer is called | by the output class. Do not 'echo' any values with compression enabled.

$config['compress_output'] = FALSE;
Licensed under: CC-BY-SA with attribution
Not affiliated with StackOverflow
scroll top