What Is GZIP Compression? A Guide to GZIP Compression for Faster Load Times

I’ll be the first to say that this was not always a topic I was an expert in. I have a long history with .zip and .rar files, so when I first heard about GZIP compression, I thought it must be something similar. Perhaps some advanced or free format that is better, faster, stronger, and whatnot?

As it turns out, I was half-right.

GZIP compression is a form of data compression, only it refers to websites and web apps due to its ability to compress content sent over HTML before it reaches the end destination.

In other words, it’s used for transferring files rather than storing them.

If you’ve ever seen a file with a .gz extension, you’ve just witnessed the work of GZIP. It speeds up data transfers, making websites load faster — which is precisely why many web servers use it to compress files before sending them to your browser.

Back in the day in the mid-80s, the compress utility/command in Unix was the go-to compression method. The story goes that corporations saw the opportunity to score big bucks by patenting the LZW algorithm used by compress, which meant using it freely wasn’t to be an option in the near future.

To solve this problem, two computer scientists, Jean-loup Gailly and Mark Adler, created a new and improved tool called GZIP in October 1992 as part of the GNU Project. Not only did it avoid those pesky patents by being free, but it also compressed files much better. Even after all these years, GZIP is still a popular choice for squeezing files down to size.

While it can compress any file regardless of what type it is or how it’s encoded, GZIP’s primary use is in compressing text-based files, such as HTML, CSS, and JavaScript. These often contain a lot of duplicate patterns, which GZIP compresses handily — by up to 90%, per some sources.

On the other hand, files that are already compressed to a point, like images and especially .zip files, might not see much improvement or might even get slightly larger due to the added metadata. To be fair, this usually doesn’t make a notable difference.

First, it looks for repeating patterns of bytes within the data. This can be text that’s constantly used like ‘the’, ‘and’, ‘of’, and such, whitespace, long strings of identical characters used for formatting, and predictable structures within certain data formats like XML.

Once it finds these patterns, it assigns shorter codes to the more frequent ones and longer codes to the less frequent ones. This efficient coding scheme allows GZIP to significantly reduce file size without compromising data integrity.

Since it’s based on a lossless compression algorithm, GZIP compression doesn’t lose any information. This means all of the web pages and style sheets are neatly packed on the server side before sending them over to your Chrome, Safari, or whatever you’re using for browsing. The compressed file, along with a special header indicating that it’s compressed with GZIP, is sent to the client.

On the client side, your browser automatically decompresses the received data using the GZIP decompression algorithm. It’s basically the compression process in reverse, thus restoring the data to its original state.

A quick word about those ‘special headers’. To make GZIP compression work as intended, web servers and browsers use a special language called HTTP headers. These tell the browser whether to ask for compressed versions of files and how to unpack them. If the server has compressed the resource using GZIP, it sets this header to ‘gzip’.

One more thing — there are nine compression levels, where level 1 offers maximum speed but at the cost of size, while level 9 provides maximum compression but at the slowest speed. I’ll go into more detail in the ‘Best practices’ section later on.

Both from a developer and user perspective, GZIP offers a few considerable advantages, such as:

Improved Page Load Times

Shrinking down file sizes inevitably leads to faster data transfers as fewer bytes need to be transferred between the server and the client.

With smaller file sizes, less time is spent on transmitting data over the network and rendering.

The resulting decrease in network latency directly impacts page load times for the better, even more so on slower connections.

On top of that, GZIP can compress files much faster than other similar methods, which is important for web pages where quick loading times are crucial.

Bandwidth Savings

By compressing files, less data flows between the server and the client, leading to less bandwidth usage. If you have a site with quite a bit of traffic, reduced bandwidth usage can drive sizable cost savings on hosting and network expenses, especially if you have a usage-based bandwidth plan.

Enhanced User Experience

It’s a well-known fact that users expect websites to load quickly (or have zero patience to wait a second or two longer).

A fast-loading site provides a smooth user experience and reduces bounce rates, making it easier to navigate and interact with it.

When people can quickly get the information they need, they tend to hang out more on the site and engage with content (particularly important for loading on mobile devices).

While we’re on the subject, Google loves fast websites, too, so by speeding up yours with GZIP compression, you can improve your search engine ranking.

Not only that, but faster load times can improve click-through rates, as visitors are more likely to click on a website that loads quickly (though a lot of other factors play a role as well).

Environmental Impact

If we’re looking at the big picture, GZIP compression uses the bare minimum of resources to do its magic. Servers are under less strain than they would be and generate less heat, which reduces the need for cooling systems.

So, what little computing power and temporary memory space GZIP compression requires reduces data center energy consumption.

While there’s plenty of good stuff coming from GZIP and its MO, it’s wise to be aware of some of its not-so-good sides.

Limited Effectiveness on Binary Files

As I’ve mentioned before, GZIP loses its effect on images, audio, and video files due to their binary nature. Because they store files in zeroes and ones, they often lack the repetitive patterns and redundancy that their text-based peers have. Furthermore, these files already sport some form of compression, hence it’s more difficult to compress them in a meaningful way.

Increased CPU Usage

Though GZIP compression won’t make outrageous computing demands, it’s a CPU-intensive process for the server to do the task at hand. More modern servers likely won’t break a major sweat, but their older and less powerful counterparts certainly might dip in performance.

This potential impact can primarily occur under heavy load, where compression and decompression call for more processing power. The same goes for higher compression levels that boost CPU utilization in order to get tightly packed files. In other words, the more you compress a file, the longer it takes.

Compatibility Issues

Disclaimer: these situations are rare, but they can happen. Sometimes, GZIP compression can run into trouble with certain proxies and older browsers that don’t handle it properly due to incorrect configuration or lack of support. This can result in corrupted or outdated content or content that isn’t fully compatible with the user’s browser.

Almost universal support and a relatively straightforward setup mean GZIP sees broad implementation, although it mostly pertains to specific (however widespread) use cases. Most notably:

All this talk doesn’t mean much if you can put it into practice, right? So, here’s how you get to enjoy the fruits of GZIP’s labor.

On Web Servers

How you go about this depends on your hosting provider and server setup. It’s always smart to take a peek at your hosting provider’s documentation for instructions on specific guidelines or restrictions on modifying server files.

In case you have the go-ahead, you’ll have to tinker with the .htaccess file if your server runs on Apache.

Here’s a quick step-by-step guide:

1. First and foremost, create a backup of the .htaccess file in the event of things going sideways for any reason.
2. Next, open your hosting provider’s control panel.
3. Navigate to the root directory (public_html) and locate the .htaccess file.
4. Edit the file with the following code:

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

5. Save the file.

This will compress all the HTML, CSS, JavaScript, XML, and font files.

For NGINX servers, the process is pretty much the same.

Follow these steps:

1. Open your hosting provider’s control panel.
2. Look for a file manager or configuration editor option.
3. Locate and open the nginx.conf file.
4. Edit it by inserting the following commands below the gzip on line:

gzip_vary on;

gzip_types text/plain text/css text/xml text/javascript application/x-javascript application/xml;

gzip_min_length 1000;

gzip_proxied no-cache no-store private expired auth;

5. Save the file.

This also compresses the whole lot, but you can modify which types of files exactly to compress in the gzip_types line by adding or removing items from it.

Using a Content Delivery Network (CDN)

You might also see GZIP hanging out with a CDN to improve content delivery. It’s because CDNs are optimized for delivering content efficiently and can handle GZIP compression effectively.

In fact, many of them have it as a built-in feature, automatically compressing eligible files before delivering them to the user’s browser.

They also offer other optimization techniques, like minification, which can further reduce file sizes when combined with GZIP. It removes white spaces and repeated variable names from your website’s code, making it smaller before GZIP does its thing. This combination of techniques can significantly speed up your website’s loading time.

To enable GZIP compression on your CDN, you’ll need to consult your CDN provider’s documentation. The exact steps may vary depending on the provider, but generally, it looks something like this:

1. Log in to your CDN control panel.
2. Navigate to the relevant settings page — look for a ‘Performance Optimization’ or ‘Compression’ section.
3. Look for a toggle switch to enable or disable GZIP compression.

Some CDNs may offer advanced configuration options, such as specifying minimum file size, compression level, and MIME types to compress, so you may want to take a look at those too.

For WordPress Sites

Those of you running a WordPress site will be happy to know there are plenty of plugins that enable GZIP compression. Here are some that do the trick, in no particular order:

• WP-Optimize: Comprehensive plugin to boost your site’s performance through caching, database cleaning and optimization, and advanced minification.
• WP Super Cache: A free caching plugin that generates and serves static HTML files by compressing pages so they’re served more quickly to visitors.
• WP Rocket: All-in-one web performance plugin featuring page and browser caching, cache preloading, delayed JavaScript execution, and eCommerce optimization, among others.
• Hummingbird: Lets you customize your website’s optimization settings through features like smart caching, minification, lazy loading, and more.
• PageSpeed Ninja: Another all-around solution for minimizing loading times, improving SERP, and boosting website speed.

These do a lot more than just compressing files, so you may have to try out a few of them to find the best fit.

After enabling GZIP, it’s a good idea to confirm that it’s compressing files as expected. You have plenty of tools at your disposal — I’ll start with browser developer ones.

To check HTTP response headers via a browser and confirm if GZIP is enabled and functioning correctly, do this:

1. Right-click on the page and click ‘Inspect’.
2. Click on the ‘Network’ tab (some browsers like Edge have a WiFi icon instead of letters).
3. Under ‘Name’, click on one of the resources that the web server has sent.
4. Go to the ‘Headers’ tab.
5. Under ‘Response Headers’, find ‘Content-Encoding’ — this is where the compression method used will be listed.

You can also use free GZIP compression checkers, like the ones from GiftOfSpeed, Sitechecker, or Small SEO Tools (there’s a bunch of them) to make sure everything is kosher.

Simply enter the URL and the checker will display which compression is used, its ratio (percentage), the size of the original file, compression time, and other information (some checkers will have more data points than others).

Alternatively, you can test and verify via a website speed test. Google’s PageSpeed Insights, GTmetrix, and Pingdom are some of the tools you can use at no cost to measure your site’s loading time and get a detailed report on what’s happening under the hood.

These tools often suggest ways to improve your site’s speed, including using compression.

Did you know that half of websites today use GZIP compression? To make the most of it, here are three things to keep top of mind.

File Types to Compress

It doesn’t hurt to repeat once more that GZIP excels when dealing with HTML, CSS, and JavaScript text files, including text-based configuration files. Other media formats like images, audio, and video, as well as archives already come compressed, so it’s best to avoid them.

In fact, with the addition of a GZIP header during compression, they might become even larger just a teensy bit. If anything, compressing these types of files again is likely to be a waste of time unless you’re using a specialized compression algorithm — which GZIP isn’t.

Setting Compression Levels

On its own, compression isn’t easy on the CPU, which is why there are nine levels of it.

As previously explained, level 1 does the job in the fastest time possible but at the cost of size and processing power, meaning you get a file that isn’t shrunk all the way. On the other hand, level 9 provides maximum compression but takes its sweet time to do so.

Ultimately, the trade-off between file size reduction and processing time depends on your needs. Most servers are set at level 6 (not 5, for some reason, which would be the logical middle ground) as it offers a balance between compression ratio and CPU usage that suits most users.

Feel free to experiment with different levels to pinpoint what works best for you. Be sure to use server monitoring tools to keep track of CPU and memory usage, along with network traffic — that’s the best way to find the optimum between file size and server load.

Compatibility Considerations

While GZIP works smoothly across different operating systems, web servers, and programming languages, hiccups can still happen here and there. Modern browsers support GZIP but to ensure different browsers and older devices don’t face difficulties, configure your server to compress text-based files and stay clear of the rest.

Moreover, monitor your website’s performance and identify any issues stemming from GZIP compression. It also may be prudent to communicate to your users that some proxies may be at fault and that a browser update will result in optimal compatibility and performance.

Your journey with GZIP compression has just begun. You may have started out reading this article thinking GZIP compression was just another method of creating .zip files. Now, you know it offers much more for websites and applications.

The next time you build a web application, consider using GZIP compression to make it faster and save bandwidth. These benefits are worth it for you and your website users!