WP What is Gzip Compression | Enabling Gzip | CDN Guide | Imperva

Gzip

47.6k views
CDN Guide

What is Gzip?

Gzip is a file format designed to compress HTTP content before it is delivered to a client. It utilizes the gzip algorithm to reduce file size and optimize transmission.

File types commonly associated with gzip include:

  • .gz: This file extension indicates that the gzip algorithm has compressed the file.
  • .tar file, tarball: While not primarily for compression, the tar format is used for archiving multiple files. Gzip can be utilized to compress .tar files.
  • .tgz, .tar.gz, .gz file: These extensions signify a .tar file that has been compressed using gzip.

By employing Gzip Compression, you can effectively decrease file sizes and enhance the efficiency of content delivery over HTTP.

HTTP Compression

HTTP compression is a capability that can be built into web servers and web clients to improve transfer speed and bandwidth utilization. When applied, this process reduces the data size before it’s sent from the server to the client, thereby reducing the time taken for the data to travel across the Internet.

HTTP compression works by using standard algorithms to compress the data on the server’s side. Once the client receives the compressed data, it is then decompressed so that the client can use it. This approach is especially useful for enhancing the performance of websites and web applications, particularly when dealing with large amounts of data or slow network connections.

The two most common types of HTTP compression are gzip and deflate, but others also exist. These compression methods are particularly effective on textual files, such as HTML, CSS, or JavaScript files, where they can reduce the size of the transmitted data by up to 70-90%.

What’s the Difference Between Lossy and Lossless Compression

Lossy Compression

Lossy compression is a method of data reduction that takes advantage of the limitations of the human senses to remove insignificant information. This compression type is primarily used in multimedia data (images, audio, and video) where slight (and unnoticeable) loss of quality is acceptable. For instance, in an image, lossy compression might remove some color data that is not noticeable to the human eye. It is important to note that once the data goes through lossy compression, the original data cannot be perfectly reconstructed or retrieved.

Lossless Compression

Unlike lossy compression, lossless compression ensures that every single bit of data that was originally in the file remains after the file is uncompressed. All of the information is completely restored. This is crucial for files that require every bit of data to be the same, such as text files or software executables. Gzip, mentioned above, is an example of a lossless compression algorithm. In this case, the original data can be perfectly reconstructed from the compressed data.

Gzip as a Software Application

Beyond the file format, gzip is also a software application used for file compression and decompression. Originating from the GNU Project, this open-source software helps minimize the size of files, directories, and filesystems. It combines the LZ77 algorithm and Huffman coding for efficient compression, making it particularly effective for text files such as HTML, CSS, JavaScript, and source code. The compressed files are given a ‘.gz’ extension. By reducing file size, Gzip enhances data transmission speeds, which is why web servers often compress data before sending it to the client’s browser.

What are the Benefits of Gzip Compression?

Gzip compression significantly reduces file size by up to 80 percent or more. This leads to faster page load times, reduced bandwidth usage, and decreased SSL overhead. By minimizing the number of roundtrips during an SSL handshake, Gzip compression enhances overall performance and efficiency.

Additionally, Gzip compression can help improve your website’s Search Engine Optimization (SEO). It reduces page load times, which is a major factor for SEO rankings, and it also reduces the file size of JavaScript and HTML files. This means that search engine web crawlers can index your pages and content more quickly.

How Does Gzip Work?

Gzip is based on a lossless compression algorithm. Through this process, the data in its original form is unaltered during and after compression.

There are two stages to gzip compression:

  1. Repeated sequences of bytes are identified during compression, represented with a shorter sequence.
  2. Shortened sequences are assigned a number of bits, determined by how frequently the sequence occurs. If a sequence appears frequently, fewer bits are assigned. Alternatively, more bits are assigned if the sequence doesn’t appear often.

Through this process, the original file becomes compressed.

How To Enable a Gzip Compression

WordPress:

Use a caching plugin that supports gzip or enable gzip on your web server through the .htaccess file.

Apache:

Add the gzip compression commands inside the mod_deflate module at the end of the .htaccess file. For example:

<IfModule mod_deflate.c>
# Compress HTML, CSS, JavaScript, Text, XML, and fonts
AddOutputFilterByType DEFLATE application/javascript
AddOutputFilterByType DEFLATE application/rss+xml
AddOutputFilterByType DEFLATE application/vnd.ms-fontobject
AddOutputFilterByType DEFLATE application/x-font
AddOutputFilterByType DEFLATE application/x-font-opentype
AddOutputFilterByType DEFLATE application/x-font-otf
AddOutputFilterByType DEFLATE application/x-font-truetype
AddOutputFilterByType DEFLATE application/x-font-ttf
AddOutputFilterByType DEFLATE application/x-javascript
AddOutputFilterByType DEFLATE application/xhtml+xml
AddOutputFilterByType DEFLATE application/xml
AddOutputFilterByType DEFLATE font/opentype
AddOutputFilterByType DEFLATE font/otf
AddOutputFilterByType DEFLATE font/ttf
AddOutputFilterByType DEFLATE image/svg+xml
AddOutputFilterByType DEFLATE image/x-icon
AddOutputFilterByType DEFLATE text/css
AddOutputFilterByType DEFLATE text/html
AddOutputFilterByType DEFLATE text/javascript
AddOutputFilterByType DEFLATE text/plain
AddOutputFilterByType DEFLATE text/xml
</IfModule>

NGINX:

Add the following code to the nginx.conf file:

gzip on;
gzip_disable "MSIE [1-6]\.(?!.*SV1)";
gzip_vary on;
gzip_types text/plain text/css text/javascript image/svg+xml image/x-icon application/javascript application/x-javascript;

Utilizing Gzip with a CDN to Enhance Content Delivery

Most content delivery networks (CDNs) offer automated file compression using gzip, eliminating the need to verify compression manually. CDNs also support various front-end optimization techniques that, when combined with gzip, further reduce outgoing file size.

One such technique is minification, which trims elements like white spaces and repeated variable names from a file’s code, potentially reducing its size by half before compression. CDNs automatically minify a site’s content, including JavaScript, HTML, and CSS, maximizing file size reduction.

Although minification may appear redundant before gzipping a file, studies have shown an additional 5-10 percent reduction in tarfile size. CDNs’ ability to perform both minifications and gzip compression ensures minimized code file sizes, significantly improving user page load times.

How to Verify Gzip Activation

Once gzip is enabled, the next step is to confirm that it effectively compresses outbound files. This can be achieved by using various online tools or inspecting a browser’s HTTP response headers. For instance, in Google Chrome, you can ensure gzip compression by navigating to the Network > Headers tab and verifying that Gzip is indicated under the Content-Encoding header.

Alternatively, you can employ cURL to examine the HTTP response headers by executing the following command:

curl -H “Accept-Encoding: gzip” -I https://sitename.com

When evaluating the response, ensure that gzip is mentioned in the Content-Encoding header, which should appear as follows:

HTTP/1.1 200 OK
Server: nginx
Date: Mon, 21 Jul 2014 01:12:36 GMT
Content-Type: text/html; charset=UTF-8…
Vary: Accept-Encoding
Content-Encoding: gzip