{"id":280,"date":"2011-11-02T13:54:41","date_gmt":"2011-11-02T04:54:41","guid":{"rendered":"http:\/\/www.santoshkori.com\/blog\/?p=280"},"modified":"2012-03-05T21:22:32","modified_gmt":"2012-03-05T12:22:32","slug":"how-to-compress-web-pages-with-gzip-or-deflate-in-http-to-improve-performance","status":"publish","type":"post","link":"https:\/\/www.santoshkori.com\/blog\/how-to-compress-web-pages-with-gzip-or-deflate-in-http-to-improve-performance\/","title":{"rendered":"How to compress web pages with Gzip or Deflate in HTTP to improve performance"},"content":{"rendered":"<p>Nowadays,  reducing web page size to improve performance or to save  bandwidth while still maintaining a good website design has become a  pain for smart web developers or designers.  This is because\u00a0 with the  latest technologies that surfaced in the recent years ( JS Libraries,\u00a0  CSS3,\u00a0 HTML 5, etc. ) , developers tend to add more styling,\u00a0animation  effects through JavaScript  or css in websites to make it look more  modern and stylish. The downside of this is that the web page size will  increase and might take much time to load and on top of that, your  server uses more bandwidth to deliver the content.<\/p>\n<p>A simple and effective way to make web pages load faster and at the  same time save bandwidth is to instruct the server to compress the data (  HTML,\u00a0 CSS, etc. ) before \u2019sending\u2019 it to the end user. Th how it  works:<\/p>\n<ol>\n<li>The server compresses the data (HTML, CSS, JavaScript ..)<\/li>\n<li>File transfers through the network( the Internet ) via HTTP or HTTPS<\/li>\n<li>The browser then decompresses the data before interpreting and displaying the content to the end user.<\/li>\n<\/ol>\n<h3>Browsers Supported<\/h3>\n<p>In the cutthroat world of web design and the wars between ancient and  modern browsers,  the first question that you might be asking  yourselves  is which browser supports\u00a0decompression. The\u00a0 good news is  that all web browsers with HTTP\/1.1 support this feature.\u00a0 Yes!\u00a0 Even  Microsoft Internet Explorer!<\/p>\n<p>Below is the list of supported browsers :<\/p>\n<ul>\n<li> Since Netscape <strong>4.6<a href=\"https:\/\/www.santoshkori.com\/blog\/wp-content\/uploads\/2011\/11\/browsers-icons.png\"><img loading=\"lazy\" decoding=\"async\" class=\"alignright size-full wp-image-281\" title=\"browsers-icons\" src=\"https:\/\/www.santoshkori.com\/blog\/wp-content\/uploads\/2011\/11\/browsers-icons.png\" alt=\"\" width=\"105\" height=\"103\"><\/a><br \/>\n<\/strong><\/li>\n<li> Microsoft Internet Explorer from <strong>4.0<\/strong> *<\/li>\n<li> Since Opera <strong>5.12<\/strong><\/li>\n<li> Firefox all versions<\/li>\n<li> Google Chrome all versions<\/li>\n<li> Safari all versions<\/li>\n<\/ul>\n<p>* With a few minor bugs to the 5.0 and 6.0 versions included<\/p>\n<h2>How things work ?<\/h2>\n<p>When a browser request a web page,\u00a0 it informs the web server that it  supports compression of pages via its HTTP Header. If it is not  included in the header,\u00a0 then the server will serve the web page without  any compression.<\/p>\n<pre> <code>\r\nGET \/ HTTP\/1.1\r\nHost:youhack.me\r\n<strong>Accept-Encoding: gzip<\/strong>\r\n User-Agent: Firefox\/5.0\r\n<\/code><\/pre>\n<p>If compression of web page is enabled on the server,\u00a0 it sends the  compressed web page to the browser indicated in the response header,\u00a0  the type of compression used through the content-encoding attribute.<\/p>\n<pre><code>\r\nHTTP\/1.1 200 OK\r\nServer: Apache\r\nContent-Type: text\/html\r\n<strong>Content-Encoding: gzip <\/strong>\r\nContent-Length: 1234\r\n<\/code><\/pre>\n<p>You can use Firebug or an online tool to know whether or not your browser or the server supports  compression\/decompression.  Below is a screenshot of response headers  and request headers for youhack.me .<\/p>\n<p><a href=\"https:\/\/www.santoshkori.com\/blog\/wp-content\/uploads\/2011\/11\/html-http-gzip-compression1.png\"><img loading=\"lazy\" decoding=\"async\" class=\"aligncenter size-full wp-image-282\" title=\"html-http-gzip-compression1\" src=\"https:\/\/www.santoshkori.com\/blog\/wp-content\/uploads\/2011\/11\/html-http-gzip-compression1.png\" alt=\"\" width=\"600\" height=\"465\" srcset=\"https:\/\/www.santoshkori.com\/blog\/wp-content\/uploads\/2011\/11\/html-http-gzip-compression1.png 600w, https:\/\/www.santoshkori.com\/blog\/wp-content\/uploads\/2011\/11\/html-http-gzip-compression1-300x232.png 300w\" sizes=\"auto, (max-width: 600px) 100vw, 600px\" \/><\/a><\/p>\n<p>From the screenshot above,\u00a0 you may have noticed that there are two different compression\/decompression algorithm used in HTTP:<\/p>\n<ol>\n<li>Gzip : More reliable and widespread than Deflate<\/li>\n<li>Deflate : Decompression and Compression is faster<\/li>\n<\/ol>\n<h2>Implement Compression in Web servers :<\/h2>\n<p><strong>Apache<\/strong> module is equipped with the official mod_deflate since version 2.0, which uses zlib, and mod_gzip or mod_deflate to version 1.3.  These modules are disabled by default but can be  activated in the general configuration of the server if you have access.   Mod_deflate by default allows you to specify file types to compress on  the fly with the directive <code>AddOutputFilterByType DEFLATE<\/code> .  Once these modules are available you can also use the file <code>.htaccess<\/code> in each directory for more flexibility.<\/p>\n<p>You can use Command line with root access  to activate the necessary modules:<\/p>\n<blockquote><p><code>a2enmod headers<\/code><br \/>\n<code>a2enmod deflate\/etc\/init.d\/apache2 restart<\/code><\/p><\/blockquote>\n<p>a2enmod is a command to enable a module<\/p>\n<p><strong>Step by Step Instruction to configure Apache Compression :<\/strong><\/p>\n<p>Edit httpd.conf to add a few directives using a text editor such as vi .<\/p>\n<div id=\"highlighter_744809\">\n<div>\n<div>\n<table>\n<tbody>\n<tr>\n<td><code>1<\/code><\/td>\n<td><code>vi httpd.conf<\/code><\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<\/div>\n<\/div>\n<\/div>\n<p>Append following line:<\/p>\n<div id=\"highlighter_414288\">\n<div>\n<div>\n<table>\n<tbody>\n<tr>\n<td><code>1<\/code><\/td>\n<td><code>LoadModule deflate_module modules\/mod_deflate.so<\/code><\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<\/div>\n<\/div>\n<\/div>\n<p>Append following configuration in directive:<\/p>\n<div id=\"highlighter_724644\">\n<div>\n<div>\n<table>\n<tbody>\n<tr>\n<td><code>1<\/code><\/td>\n<td><code>&lt;Location \/&gt;<\/code><\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<\/div>\n<div>\n<table>\n<tbody>\n<tr>\n<td><code>2<\/code><\/td>\n<td><code>AddOutputFilterByType DEFLATE text\/html text\/plain text\/xml<\/code><\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<\/div>\n<div>\n<table>\n<tbody>\n<tr>\n<td><code>3<\/code><\/td>\n<td><code>&lt;Location&gt;<\/code><\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<\/div>\n<\/div>\n<\/div>\n<p>You can also specify other file type such as Javascript , CSS to compress .Below is the configuration of one of my servers :<\/p>\n<div id=\"highlighter_413592\">\n<div>\n<div>\n<table>\n<tbody>\n<tr>\n<td><code>01<\/code><\/td>\n<td><code>&lt;IfModule mod_deflate.c&gt;<\/code><\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<\/div>\n<div>\n<table>\n<tbody>\n<tr>\n<td><code>02<\/code><\/td>\n<td><code> <\/code><code>DeflateCompressionLevel 1<\/code><\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<\/div>\n<div>\n<table>\n<tbody>\n<tr>\n<td><code>03<\/code><\/td>\n<td><code>&lt;\/IfModule&gt;<\/code><\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<\/div>\n<div>\n<table>\n<tbody>\n<tr>\n<td><code>04<\/code><\/td>\n<td><\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<\/div>\n<div>\n<table>\n<tbody>\n<tr>\n<td><code>05<\/code><\/td>\n<td><code>&lt;Location \/&gt;<\/code><\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<\/div>\n<div>\n<table>\n<tbody>\n<tr>\n<td><code>06<\/code><\/td>\n<td><code> <\/code><code>AddOutputFilterByType DEFLATE text\/plain<\/code><\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<\/div>\n<div>\n<table>\n<tbody>\n<tr>\n<td><code>07<\/code><\/td>\n<td><code> <\/code><code>AddOutputFilterByType DEFLATE text\/xml<\/code><\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<\/div>\n<div>\n<table>\n<tbody>\n<tr>\n<td><code>08<\/code><\/td>\n<td><code> <\/code><code>AddOutputFilterByType DEFLATE text\/html<\/code><\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<\/div>\n<div>\n<table>\n<tbody>\n<tr>\n<td><code>09<\/code><\/td>\n<td><code> <\/code><code>AddOutputFilterByType DEFLATE text\/css<\/code><\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<\/div>\n<div>\n<table>\n<tbody>\n<tr>\n<td><code>10<\/code><\/td>\n<td><code> <\/code><code>AddOutputFilterByType DEFLATE image\/svg+xml<\/code><\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<\/div>\n<div>\n<table>\n<tbody>\n<tr>\n<td><code>11<\/code><\/td>\n<td><code> <\/code><code>AddOutputFilterByType DEFLATE application\/xhtml+xml<\/code><\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<\/div>\n<div>\n<table>\n<tbody>\n<tr>\n<td><code>12<\/code><\/td>\n<td><code> <\/code><code>AddOutputFilterByType DEFLATE application\/xml<\/code><\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<\/div>\n<div>\n<table>\n<tbody>\n<tr>\n<td><code>13<\/code><\/td>\n<td><code> <\/code><code>AddOutputFilterByType DEFLATE application\/rss+xml<\/code><\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<\/div>\n<div>\n<table>\n<tbody>\n<tr>\n<td><code>14<\/code><\/td>\n<td><code> <\/code><code>AddOutputFilterByType DEFLATE application\/atom_xml<\/code><\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<\/div>\n<div>\n<table>\n<tbody>\n<tr>\n<td><code>15<\/code><\/td>\n<td><code> <\/code><code>AddOutputFilterByType DEFLATE application\/x-javascript<\/code><\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<\/div>\n<div>\n<table>\n<tbody>\n<tr>\n<td><code>16<\/code><\/td>\n<td><code> <\/code><code>AddOutputFilterByType DEFLATE application\/x-httpd-php<\/code><\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<\/div>\n<div>\n<table>\n<tbody>\n<tr>\n<td><code>17<\/code><\/td>\n<td><code> <\/code><code>AddOutputFilterByType DEFLATE application\/x-httpd-fastphp<\/code><\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<\/div>\n<div>\n<table>\n<tbody>\n<tr>\n<td><code>18<\/code><\/td>\n<td><code> <\/code><code>AddOutputFilterByType DEFLATE application\/x-httpd-eruby<\/code><\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<\/div>\n<div>\n<table>\n<tbody>\n<tr>\n<td><code>19<\/code><\/td>\n<td><\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<\/div>\n<div>\n<table>\n<tbody>\n<tr>\n<td><code>20<\/code><\/td>\n<td><code> <\/code><code>SetOutputFilter DEFLATE<\/code><\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<\/div>\n<div>\n<table>\n<tbody>\n<tr>\n<td><code>21<\/code><\/td>\n<td><\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<\/div>\n<div>\n<table>\n<tbody>\n<tr>\n<td><code>22<\/code><\/td>\n<td><code> <\/code><code>SetEnvIfNoCase Request_URI \\.(?:gif|jpe?g|png)$ no-gzip dont-vary<\/code><\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<\/div>\n<div>\n<table>\n<tbody>\n<tr>\n<td><code>23<\/code><\/td>\n<td><code> <\/code><code>SetEnvIfNoCase Request_URI \\.(?:exe|t?gz|zip|bz2|sit|rar)$ no-gzip dont-vary<\/code><\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<\/div>\n<div>\n<table>\n<tbody>\n<tr>\n<td><code>24<\/code><\/td>\n<td><code> <\/code><code>SetEnvIfNoCase Request_URI \\.(?:pdf|avi|mov|mp3|mp4|rm)$ no-gzip dont-vary<\/code><\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<\/div>\n<div>\n<table>\n<tbody>\n<tr>\n<td><code>25<\/code><\/td>\n<td><\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<\/div>\n<div>\n<table>\n<tbody>\n<tr>\n<td><code>26<\/code><\/td>\n<td><code> <\/code><code>BrowserMatch ^Mozilla\/4 gzip-only-text\/html<\/code><\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<\/div>\n<div>\n<table>\n<tbody>\n<tr>\n<td><code>27<\/code><\/td>\n<td><code> <\/code><code>BrowserMatch ^Mozilla\/4\\.0[678] no-gzip<\/code><\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<\/div>\n<div>\n<table>\n<tbody>\n<tr>\n<td><code>28<\/code><\/td>\n<td><code> <\/code><code>BrowserMatch \\bMSIE !no-gzip !gzip-only-text\/html<\/code><\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<\/div>\n<div>\n<table>\n<tbody>\n<tr>\n<td><code>29<\/code><\/td>\n<td><\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<\/div>\n<div>\n<table>\n<tbody>\n<tr>\n<td><code>30<\/code><\/td>\n<td><code> <\/code><code># Proxies should not deliver wrong content<\/code><\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<\/div>\n<div>\n<table>\n<tbody>\n<tr>\n<td><code>31<\/code><\/td>\n<td><code> <\/code><code>Header append Vary User-Agent env=!dont-vary<\/code><\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<\/div>\n<div>\n<table>\n<tbody>\n<tr>\n<td><code>32<\/code><\/td>\n<td><code>&lt;\/Location&gt;<\/code><\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<\/div>\n<\/div>\n<\/div>\n<p><code>DeflateCompressionLevel<\/code><br \/>\nIndicate the level of compression. It takes a value between 1 and 9. The higher the value,  the higher is the compression.<br \/>\n<code>AddOutputFilterByType DEFLATE text\/html<\/code><br \/>\nApply compression only on file of mime type text\/html<br \/>\n<code>SetOutputFilter DEFLATE<\/code><br \/>\nSpecifies the type of compression used.<br \/>\n<code>SetEnvIfNoCase Request_URI \\.(?:gif|jpe?g|png)$ no-gzip dont-vary<\/code><br \/>\nExclude images in format gif , png and jpeg<br \/>\n<code>BrowserMatch ^Mozilla\/4 gzip-only-text\/html<\/code><br \/>\nActivate or disactivate compression for certain browsers. In the above  example, we have excluded Netscape 4.X since it compresses only  text\/html.For the last two BrowserMatch instruction, compression is  activated for Mozilla and Internet Explorer.<\/p>\n<p>That\u2019s all ! You can now save and close httpd.config and\u00a0restart apache web server.<\/p>\n<div id=\"highlighter_237243\">\n<div>\n<div>\n<table>\n<tbody>\n<tr>\n<td><code>1<\/code><\/td>\n<td><code># \/etc\/init.d\/httpd restart<\/code><\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<\/div>\n<\/div>\n<\/div>\n<h2>More instructions<\/h2>\n<p>You can also instruct Apache server to compress only files in specific directory.For example \/files\/js<\/p>\n<div id=\"highlighter_553292\">\n<div>\n<div>\n<table>\n<tbody>\n<tr>\n<td><code>1<\/code><\/td>\n<td><code>&lt;Directory \"\/files\/js\"&gt;<\/code><\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<\/div>\n<div>\n<table>\n<tbody>\n<tr>\n<td><code>2<\/code><\/td>\n<td><code>AddOutputFilterByType DEFLATE text\/html<\/code><\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<\/div>\n<div>\n<table>\n<tbody>\n<tr>\n<td><code>3<\/code><\/td>\n<td><code>&lt;\/Directory&gt;<\/code><\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<\/div>\n<\/div>\n<\/div>\n<p>You would not want to compress every single type of files. The  instruction below contains a list of file types that you should avoid  compressing :<\/p>\n<div id=\"highlighter_535624\">\n<div>\n<div>\n<table>\n<tbody>\n<tr>\n<td><code>1<\/code><\/td>\n<td><code>SetOutputFilter DEFLATE<\/code><\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<\/div>\n<div>\n<table>\n<tbody>\n<tr>\n<td><code>2<\/code><\/td>\n<td><code>SetEnvIfNoCase Request_URI \\.(?:gif|jpe?g|png)$ no-gzip dont-vary<\/code><\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<\/div>\n<div>\n<table>\n<tbody>\n<tr>\n<td><code>3<\/code><\/td>\n<td><code>SetEnvIfNoCase Request_URI \\.(?:exe|t?gz|zip|bz2|sit|rar)$ no-gzip dont-vary<\/code><\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<\/div>\n<div>\n<table>\n<tbody>\n<tr>\n<td><code>4<\/code><\/td>\n<td><code>SetEnvIfNoCase Request_URI \\.pdf$ no-gzip dont-vary<\/code><\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<\/div>\n<div>\n<table>\n<tbody>\n<tr>\n<td><code>5<\/code><\/td>\n<td><code>SetEnvIfNoCase Request_URI \\.avi$ no-gzip dont-vary<\/code><\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<\/div>\n<div>\n<table>\n<tbody>\n<tr>\n<td><code>6<\/code><\/td>\n<td><code>SetEnvIfNoCase Request_URI \\.mov$ no-gzip dont-vary<\/code><\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<\/div>\n<div>\n<table>\n<tbody>\n<tr>\n<td><code>7<\/code><\/td>\n<td><code>SetEnvIfNoCase Request_URI \\.mp3$ no-gzip dont-vary<\/code><\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<\/div>\n<div>\n<table>\n<tbody>\n<tr>\n<td><code>8<\/code><\/td>\n<td><code>SetEnvIfNoCase Request_URI \\.mp4$ no-gzip dont-vary<\/code><\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<\/div>\n<div>\n<table>\n<tbody>\n<tr>\n<td><code>9<\/code><\/td>\n<td><code>SetEnvIfNoCase Request_URI \\.rm$ no-gzip dont-vary<\/code><\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<\/div>\n<\/div>\n<\/div>\n<p>Enable compression though .htaccess file<br \/>\nMost shared server hosting does not allow webmasters to edit  httpd.config .You can enable compression instruction via a .htaccess  file placed in your root directory .Below is a typical .htaccess file if  you are running a wordpress blog .<\/p>\n<div id=\"highlighter_923114\">\n<div>\n<div>\n<table>\n<tbody>\n<tr>\n<td><code>01<\/code><\/td>\n<td><code>AuthName \"public_html\"<\/code><\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<\/div>\n<div>\n<table>\n<tbody>\n<tr>\n<td><code>02<\/code><\/td>\n<td><code># BEGIN WordPress<\/code><\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<\/div>\n<div>\n<table>\n<tbody>\n<tr>\n<td><code>03<\/code><\/td>\n<td><code>&lt;IfModule mod_rewrite.c&gt;<\/code><\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<\/div>\n<div>\n<table>\n<tbody>\n<tr>\n<td><code>04<\/code><\/td>\n<td><code>RewriteEngine On<\/code><\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<\/div>\n<div>\n<table>\n<tbody>\n<tr>\n<td><code>05<\/code><\/td>\n<td><code>RewriteBase \/<\/code><\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<\/div>\n<div>\n<table>\n<tbody>\n<tr>\n<td><code>06<\/code><\/td>\n<td><code>RewriteCond %{REQUEST_FILENAME} !-f<\/code><\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<\/div>\n<div>\n<table>\n<tbody>\n<tr>\n<td><code>07<\/code><\/td>\n<td><code>RewriteCond %{REQUEST_FILENAME} !-d<\/code><\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<\/div>\n<div>\n<table>\n<tbody>\n<tr>\n<td><code>08<\/code><\/td>\n<td><code>RewriteRule . \/index.php [L]<\/code><\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<\/div>\n<div>\n<table>\n<tbody>\n<tr>\n<td><code>09<\/code><\/td>\n<td><code>&lt;\/IfModule&gt;<\/code><\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<\/div>\n<div>\n<table>\n<tbody>\n<tr>\n<td><code>10<\/code><\/td>\n<td><\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<\/div>\n<div>\n<table>\n<tbody>\n<tr>\n<td><code>11<\/code><\/td>\n<td><code># END WordPress<\/code><\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<\/div>\n<\/div>\n<\/div>\n<p>Append the following instruction to .htaccess to enable Deflate compression on your website :<\/p>\n<div id=\"highlighter_413481\">\n<div>\n<div>\n<table>\n<tbody>\n<tr>\n<td><code>01<\/code><\/td>\n<td><code>[\/sourcecode]<\/code><\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<\/div>\n<div>\n<table>\n<tbody>\n<tr>\n<td><code>02<\/code><\/td>\n<td><\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<\/div>\n<div>\n<table>\n<tbody>\n<tr>\n<td><code>03<\/code><\/td>\n<td><code>&lt;IfModule mod_deflate.c&gt;<\/code><\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<\/div>\n<div>\n<table>\n<tbody>\n<tr>\n<td><code>04<\/code><\/td>\n<td><code># Compression filters<\/code><\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<\/div>\n<div>\n<table>\n<tbody>\n<tr>\n<td><code>05<\/code><\/td>\n<td><code>AddOutputFilterByType DEFLATE text\/plain<\/code><\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<\/div>\n<div>\n<table>\n<tbody>\n<tr>\n<td><code>06<\/code><\/td>\n<td><code>AddOutputFilterByType DEFLATE text\/html<\/code><\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<\/div>\n<div>\n<table>\n<tbody>\n<tr>\n<td><code>07<\/code><\/td>\n<td><code>AddOutputFilterByType DEFLATE text\/css<\/code><\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<\/div>\n<div>\n<table>\n<tbody>\n<tr>\n<td><code>08<\/code><\/td>\n<td><code>AddOutputFilterByType DEFLATE application\/xhtml+xml<\/code><\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<\/div>\n<div>\n<table>\n<tbody>\n<tr>\n<td><code>09<\/code><\/td>\n<td><code>AddOutputFilterByType DEFLATE application\/javascript<\/code><\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<\/div>\n<div>\n<table>\n<tbody>\n<tr>\n<td><code>10<\/code><\/td>\n<td><code>AddOutputFilterByType DEFLATE application\/x-javascript<\/code><\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<\/div>\n<div>\n<table>\n<tbody>\n<tr>\n<td><code>11<\/code><\/td>\n<td><code>AddOutputFilterByType DEFLATE application\/x-httpd-php<\/code><\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<\/div>\n<div>\n<table>\n<tbody>\n<tr>\n<td><code>12<\/code><\/td>\n<td><code>AddOutputFilterByType DEFLATE application\/x-httpd-fastphp<\/code><\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<\/div>\n<div>\n<table>\n<tbody>\n<tr>\n<td><code>13<\/code><\/td>\n<td><\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<\/div>\n<div>\n<table>\n<tbody>\n<tr>\n<td><code>14<\/code><\/td>\n<td><code># Exclude older browser version<\/code><\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<\/div>\n<div>\n<table>\n<tbody>\n<tr>\n<td><code>15<\/code><\/td>\n<td><code>BrowserMatch ^Mozilla\/4 gzip-only-text\/html<\/code><\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<\/div>\n<div>\n<table>\n<tbody>\n<tr>\n<td><code>16<\/code><\/td>\n<td><code>BrowserMatch ^Mozilla\/4\\.0[678] no-gzip<\/code><\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<\/div>\n<div>\n<table>\n<tbody>\n<tr>\n<td><code>17<\/code><\/td>\n<td><code>BrowserMatch \\bMSI[E] !no-gzip !gzip-only-text\/html<\/code><\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<\/div>\n<div>\n<table>\n<tbody>\n<tr>\n<td><code>18<\/code><\/td>\n<td><\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<\/div>\n<div>\n<table>\n<tbody>\n<tr>\n<td><code>19<\/code><\/td>\n<td><code># Proxies should not deliver wrong content<\/code><\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<\/div>\n<div>\n<table>\n<tbody>\n<tr>\n<td><code>20<\/code><\/td>\n<td><code>Header append Vary User-Agent env=!dont-vary<\/code><\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<\/div>\n<div>\n<table>\n<tbody>\n<tr>\n<td><code>21<\/code><\/td>\n<td><code>&lt;\/IfModule&gt;<\/code><\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<\/div>\n<div>\n<table>\n<tbody>\n<tr>\n<td><code>22<\/code><\/td>\n<td><\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<\/div>\n<div>\n<table>\n<tbody>\n<tr>\n<td><code>23<\/code><\/td>\n<td><code><\/code><\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<\/div>\n<\/div>\n<\/div>\n<p>If you want to check the page size after activating compression in Apache .Open your FireFox,Go to <strong>Tools <\/strong>-&gt;<strong>Page Info<\/strong><\/p>\n<p><strong><\/strong><br \/>\n<a href=\"https:\/\/www.santoshkori.com\/blog\/wp-content\/uploads\/2011\/11\/Info-page-on-compression-in-firefox.png\"><img loading=\"lazy\" decoding=\"async\" class=\"aligncenter size-full wp-image-283\" title=\"Info-page-on-compression-in-firefox\" src=\"https:\/\/www.santoshkori.com\/blog\/wp-content\/uploads\/2011\/11\/Info-page-on-compression-in-firefox.png\" alt=\"\" width=\"595\" height=\"497\" srcset=\"https:\/\/www.santoshkori.com\/blog\/wp-content\/uploads\/2011\/11\/Info-page-on-compression-in-firefox.png 595w, https:\/\/www.santoshkori.com\/blog\/wp-content\/uploads\/2011\/11\/Info-page-on-compression-in-firefox-300x250.png 300w\" sizes=\"auto, (max-width: 595px) 100vw, 595px\" \/><\/a><\/p>\n<h2>The bottom line :<\/h2>\n<p>Compression requires more processing power and memory on the server  as well as decompression on the user browser. Compressing too many file  types might make your website run more slowly instead of the opposite.  So you should be careful when using compression on Apache.<\/p>\n","protected":false},"excerpt":{"rendered":"<p>Nowadays, reducing web page size to improve performance or to save bandwidth while still maintaining a good website design has become a pain for smart web developers or designers. This is because\u00a0 with the latest technologies that surfaced in the recent years ( JS Libraries,\u00a0 CSS3,\u00a0 HTML 5, etc. ) , developers tend to add [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":283,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[45,16,103,17],"tags":[143],"class_list":["post-280","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-joomla","category-just-blogging","category-moo-tools","category-tips-n-tricks","tag-how-to-compress-web-pages-with-gzip-or-deflate"],"_links":{"self":[{"href":"https:\/\/www.santoshkori.com\/blog\/wp-json\/wp\/v2\/posts\/280","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.santoshkori.com\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.santoshkori.com\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.santoshkori.com\/blog\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/www.santoshkori.com\/blog\/wp-json\/wp\/v2\/comments?post=280"}],"version-history":[{"count":3,"href":"https:\/\/www.santoshkori.com\/blog\/wp-json\/wp\/v2\/posts\/280\/revisions"}],"predecessor-version":[{"id":285,"href":"https:\/\/www.santoshkori.com\/blog\/wp-json\/wp\/v2\/posts\/280\/revisions\/285"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/www.santoshkori.com\/blog\/wp-json\/wp\/v2\/media\/283"}],"wp:attachment":[{"href":"https:\/\/www.santoshkori.com\/blog\/wp-json\/wp\/v2\/media?parent=280"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.santoshkori.com\/blog\/wp-json\/wp\/v2\/categories?post=280"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.santoshkori.com\/blog\/wp-json\/wp\/v2\/tags?post=280"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}