How to enable GZIP compression to speed up WordPress sites

The easiest way to speed up your WordPress site is to eliminate all unwanted resources. The second easiest way to speed it up is to compress all the resources you need. Enabling GZIP compression on your Web server is one of the easiest and most effective ways to achieve this goal.

by default, all modern browsers support GZIP compression. However, to provide your users with trouble-free compressed resources, you must configure your server correctly.

in this article, you will learn the basics of network data compression, what GZIP compression is, its benefits, and how to use it to speed up WordPress sites on different server settings. The basics of data compression on

1. Web
2. what is GZIP compression? How does
3. check if GZIP compression is enabled
4. how to enable GZIP compression an alternative to
5. GZIP compression

Web data compression on the

network is the process of reducing the size of data transmitted by a website. There are several ways to compress data depending on the data type-text, images, style sheets, scripts, fonts.

, the main component of

pages, for example, shrinking HTML, CSS, and JavaScript is an easy way to reduce the amount of data sent by browsers. Here, the compressor compresses the text by removing unnecessary characters, such as comments and spaces, from the source code.

in the following example of a simple HTML document, there are three content types: HTML tags, CSS styles, and JavaScript code. Each content type of

has its own syntax and semantics. Overall, the HTML document has a total of 357 characters. The code above

/* wbolt-banner is used on the homepage only */
.wbolt-banner { font-size: 150% }
.wbolt-banner { width: 75% }
...


wboltScripts(); // random scripts used on the page

is easy to read and follow. It is very suitable for development. However, there is no need for browsers to read comments and have perfectly indented tags. The smart compressor can analyze this document and remove all unnecessary parts from it. When the

.wbolt-banner{font-size:150%;width:75%}
...
wboltScripts();

is shrunk, the HTML document is reduced to only 141 characters. This saves 60.50% of the characters. It’s not easy for eyes, but it’s not important for browsers. It still displays the same page to the user. To take advantage of these two versions of

, you can maintain the original document as a “development version,” but shrink all the code before releasing it.

most WordPress performance plug-ins automatically handle this issue for you.

uncompressed and reduced the file size of jQuery compressed

for example, the uncompressed version of the jQuery 3.5.1 library is more than three times larger than the shrunk version of the same file.

similarly, the same compression techniques mentioned above can optimize other content types, such as images, videos, fonts, etc. A reduction like this for specific content is the first step in optimizing the size of a site’s text-based assets.

but data compression is not just about shrinking. Using advanced mathematical technology, data compression algorithm can further reduce the size of data. One of the most popular examples of

as a data compression method is GZIP. It achieves efficient data transmission and makes a significant contribution to making the Internet a viable global communication medium.

what is GZIP compression?

GZIP, the abbreviation of GNU Zip, is the most popular lossless data compression method on the network. It allows you to reduce the size of your site’s HTML pages, stylesheets, and scripts.

GZIP is not only a data compression algorithm, but also a file extension (.gz) and software for file compression / decompression.

, which is based on DEFLATE algorithm, is a mixture of LZ77 coding and Huffman coding algorithm.

GZIP compression is based on the DEFLATE algorithm

GZIP compressor to obtain a set of raw data and compress it losslessly. Raw data can come from any file type, but GZIP is best suited for text-based assets (such as HTML, CSS, JS). The next section on

takes an in-depth look at how GZIP compression works. How

GZIP compresses data

A rough explanation of the working principle of GZIP compression

first, the GZIP compressor runs the LZ77 compression algorithm on the raw data to eliminate redundancy. The algorithm works by looking for repetitive patterns in predefined sliding windows (a small part of the original data).

then replaces all repeated strings with tuples to compress the original data. Schematic diagram of

LZ77 coding algorithm

in the above example, the sliding window size is only 13 characters long (13 bytes). However, GZIP compression can use the maximum sliding window size of 32KB (32768 bytes). The size of the sliding window plays a key role in the LZ77 compression performance. After

uses the LZ77 algorithm to compress the original data, the GZIP compressor uses the Huffman coding algorithm to further compress. It does this by assigning the lowest number of digits to characters that appear more frequently, while assigning the highest number of digits to rare characters. The technique of

is similar to that used in Morse code, where the letters that appear more frequently in English get the shortest sequence.

to understand how the Huffman coding algorithm works, consider the word BOOKKEEPER. It is 10 characters long, but it has only 6 unique characters. The word is a good mix of single, double and triple letters. Almost all

websites use UTF-8 character encoding to represent letters and symbols. Each ASCII character (including the alphabet) in UTF-8 uses 1 byte (8 bits).

The word “BOOKKEEPER” has many repetitive letters.

10-character strings such as BOOKKEEPER will require 10 bytes (80 bits) of memory. You can see that it contains 1-letter instance B, P, RMagol 2-letter instance O and Kpar 3-letter instance E. The

Huffman coding algorithm uses this knowledge to compress strings losslessly. It is achieved by generating a binary tree that uses each unique letter as a leaf. The letters with the lowest occurrence of

(such as B, P, R) will be at the bottom of the tree, while those that occur frequently (such as E, O, K) will ideally be at the top. The topmost node in the

tree is root, whose value is equal to the total number of characters in the string. After the Huffman tree

of the word

“BOOKKEEPER” generates the Huffman tree, all the left and right branch arrows are assigned the 0 and 1 numbers, respectively. You can then generate Hoffman code for any character by tracking the path from root to leaf and connecting all zeros and ones. The

Huffman code is the only binary code for each character

you can notice that the most frequent letter has the lowest bit size Huffman code.

Note: the Huffman coding algorithm can generate alternative binaries by using different sorting strategies for characters of the same frequency. However, the total size of the encoded string remains the same. The memory required for storing the original word in the 80-bit

encoded by

as a 25-bit string is reduced by 68.75%.

uses a Huffman tree with a 0 / 1 convention to generate binary code that satisfies the prefix attribute. It ensures that the Huffman code for any particular character is not a prefix to any other character code, so that the encoded string can be easily decoded using the Huffman tree. This plays an important role in the decompression speed of GZIP.

is like the word above, and the GZIP compressor uses the Huffman coding algorithm to further optimize the tuples generated by the LZ77 algorithm. This results in highly compressed files with a .gz extension.

if you are interested in learning more about how GZIP works, please refer to this video for a quick overview. How good is

GZIP compression?

typically has a compression ratio of about 70 per cent for small files, but up to 90 per cent for larger text-based assets.

the GZIP compression ratio of some popular CSS and JS libraries

in the above table, you can see that shrinking files with GZIP compression can further reduce their size.

Note: you can use GZIP to compress any file type, but it doesn’t save any money on assets (such as images, videos) that have been compressed using other methods. Sometimes, it may even increase the file size. The strength of

compression algorithm depends not only on its compression ratio, but also on its speed and efficiency of compressing and decompressing data. This is the advantage of GZIP in most use cases. Because GZIP uses a streaming algorithm to decompress quickly,

is very suitable for the speed-critical Web protocol. In addition, GZIP uses minimal resources to compress and decompress data, making it an ideal choice for both servers and clients. Compression performance of

brotli vs bzip2 vs GZIP vs xz (source: OpenCPU) the chart above compares the compression performance of brotli, bzip2, gzip, and xz compression algorithms. GZIP dropped slightly in compression ratio tests, but it completely beat its competitors in terms of compression and decompression speed. When

looks at the compression speed diagram, we can conclude that GZIP is well suited for real-time compression in HTTP servers and other data streams on the network. Considering all its positive factors in promoting Web, IETF approved GZIP as one of the three compression standard formats in HTTP/1.1.

Note: many popular operating systems (Linux, macOS, iOS) and modern game consoles (PlayStation 4, Wii U, Xbox One) use the abstract zlib of the GZIP compression library. It is also used to compress images in a lossless PNG file format. Six advantages of

GZIP compression

let’s take a closer look at the most important advantages of GZIP compression.

provides a good compression ratio

as mentioned earlier, GZIP does not have the best compression ratio compared to competitors. But it’s not far from them. In general, it can help you reduce the size of text-based resources by 70-90%.

Ultra-fast compression and decompression

for data compression and decompression speed, GZIP is the clear winner. There is a great need for dynamic compression in HTTP servers and other data streams.

Requires very little memory

GZIP leaves a minimum memory footprint, making it suitable for servers and systems with limited memory capacity. As a result, you will find that even the cheapest web hosting service provider supports it.

Even in the worst case, it won’t expand too much.

lossless data compression algorithms like GZIP have a strict limit beyond which data cannot be compressed.

typically occurs when resources are already well compressed, or when resources are small and the cost of adding GZIP dictionaries is higher than the compression savings. We can attribute this phenomenon to a concept called entropy coding. GZIP has a strong resistance to this effect.

Free use and open source

GZIP was originally created as a free and open source alternative to the patented compression program used in early Unix systems. Therefore, it is not bound by any patent and anyone can use it freely.

Enjoy general support

according to W3Techs, 82% of all the sites they track use GZIP compression, making it the most widely used compression algorithm on the network. Almost all servers and clients of

support GZIP. No matter which server you host your Web site, you can speed it up by enabling GZIP on it.

GZIP in the website speed testing tool warns that apart from shrinking

, enabling GZIP is one of the simplest and most effective speed optimizations you can implement on your site.

this is also one of the easiest ways to optimize WordPress. Still, many WordPress sites don’t use it.

when you visit a website, your browser checks to see if the Web server has GZIP enabled by checking the

response header. If the header exists, it retrieves the compressed files, unzips them, and then automatically provides you with smaller files. The “content-encoding: gzip” response headercontent-encoding: gzipin

Chrome DevTools downloads the uncompressed file if the browser does not detect the GZIP response header. In most cases, the difference in page loading speed may be a few seconds. Therefore, if you do not enable GZIP, you will see a warning in the website speed test tool.

GZIP warnings in Google PageSpeed Insights / Lighthouse

Google PageSpeed Insights issues a warning when no text compression is enabled on your site.

Note: Google PageSpeed Insights and Google Lighthouse are two independent website performance testing tools. They worked independently until 2018 when Google upgraded PageSpeed Insights to use Lighthouse as its analysis engine. So PageSpeed Insights and Lighthouse are the same thing now. Enable text Compression in

Google PageSpeed Insights warns

that in the sample site above, compressing text-based resources can reduce page weight by more than 78% and increase page load time by 2.1 seconds.

Note: PageSpeed Insights depends on the response header that the server returns to the browser. Sometimes, even if you enable GZIP compression, it may display an error warning. This may be due to running speed tests on machines that use intermediate proxy servers or security software. They may interfere with downloading compressed files from an external server.

GZIP warnings in GTmetrix

if your site does not provide text-based compressed resources, GTmetrix displays a warning. Like Google PageSpeed Insights, it also shows you the potential savings you can achieve. Enable Compression in

GTmetrix warns

that GTmetrix is upgrading its speed testing algorithm to replace the old PageSpeed Insights and YSlow libraries with the latest Google Lighthouse metrics. You can expect its GZIP compression warning to be similar to the warning displayed by Lighthouse.

GZIP warnings in the Pingdom tool

Pingdom Tools directly warns you to use GZIP to compress your site components. “use GZIP Compression components” in the

Pingdom tool warns

in the description section, Pingdom Tools also provides you with some statistics about the importance of GZIP.

GZIP warnings in WebPageTest

if WebPageTest detects that no compressible response is provided in an optimized manner, it displays a warning in its Performance Review tab. The “use GZIP Compression” warning in

WebPageTest

WebPageTest also gives a rating score to show the severity of the warning. For example, it gives the above warning a score of 23 out of 100, which means that you should address it first. How

checks whether GZIP compression is enabled

is effectively supported by all modern browsers in the

HTTP header. As a result, most Web hosts enable GZIP compression on all their servers by default.Accept-Encoding: gzip, deflatewhen the Web server sees this header sent by the browser, they recognize the browser’s support for GZIP and use the

header to respond with a compressed HTTP response.content-encoding: gziphowever, if you are using another WordPress hosting provider, or if you just want to make sure that your website correctly provides GZIP compressed content, always check that it is enabled.

here are some simple ways to check GZIP compression.

1. Online GZIP Compression Test tool

using online tools is the easiest way to check if GZIP compression is enabled on your website. I recommend using free Check GZIP compression or HTTP compression testing tools. Just enter your website URL and click the “Check” or “Test” button. Both online tools,

, show you a brief report on whether or not GZIP is enabled, and the amount of data you have saved (or may have saved) by testing URL with GZIP compression enabled. The first

tool will also show you other relevant information, such as the server type, content type, and compression time of your site.

uses the Check GZIP Compression tool to test wbolt.com ‘s home page

Testing wbolt.com

with the HTTP Compression Test tool you should notice that GZIP optimization is not only limited to your web page, but also includes its static text-based resources, such as stylesheets, scripts, and fonts. If you use CDN to serve these assets, you need to make sure that CDN also provides services that enable GZIP compression for them.

most modern CDN, such as Cloudflare, KeyCDN, and CloudFront, support GZIP compression. You can test the assets of the CDN service for GZIP compression by linking directly to the asset.

for GZIP compression testing of

assets managed by CDN in the above report, you can see that Kinsta CDN uses the KeyCDN engine, which is a traditional pull CDN.

2. The “content-encoding: gzip” HTTP response header

verifies that a Web site provides GZIP compressed content. The second way is to verify the

HTTP response header.content-encoding: gzipyou can open Chrome DevTools or Firefox Developer Tools and look for this response header under the Network section.

I have shown its appearance in Chrome DevTools before. This is what it looks like in Firefox developer tools.

The “content-encoding: gzip” header

in the Firefox developer tool you can also enable the “Use large request rows” option in the Chrome DevTools settings panel to view the original and compressed size of the page. As shown below, the size of the original page is reduced from 118KB to 22.9KB only after using GZIP compression.

views compressed and uncompressed page sizes in Chrome Devtools,

3. 0.

most website speed testing tools warn you not to use compression such as GZIP to serve your pages. Many readers of this article may be because of these GZIP warnings, many of which I have discussed in depth above. GZIP in

‘s various web speed testing tools warns

that you can use speed tools such as PageSPEed Insights, GTmetrix, Pingdom Tools, and WebPageTest to check whether your WordPress site has GZIP compression enabled. How

enables GZIP Compression

if GZIP compression is not enabled on your Web server, there are many ways to enable it. The exact method depends on the Web server you use to host the Web site.

important tip: as usual, back up your site and server configuration files before editing them.

uses the WordPress plug-in to enable GZIP

the easiest way to enable GZIP compression on a WordPress site is to use a cache or performance tuning plug-in.

for example, if you host your WordPress site on an Apache Web server, W3 Total Cache includes an option to enable GZIP compression under its browser cache settings panel.

similarly, WP Rocket allows you to automatically add GZIP compression rules. These plug-ins enable GZIP compression by adding Apache’s

module to the .htaccess file.mod_deflateenabling the GZIP Compression

WordPress plug-in in W3 Total Cache requires permissions to modify files on the Web server. If they do not have the correct permissions, they will fail or show you an error.

in this case, you need to contact your managed service provider or manually modify the configuration file of your Web server using the following code snippet.

enables GZIP

on Apache Web servers according to Netcraft, there are more active sites for Apache services than any other Web server in use today. It is also one of two Web servers recommended by WordPress. For

to enable GZIP compression on the Apache server, you need to use its

andmod_filtermodules and configure them correctly with the correct instructions. They will instruct Apache to compress the server output before sending it to the client over the network.mod_deflateyou have two options to edit the server configuration of Apache based on the level of access you have:

if you have access to the master server configuration file (commonly referred to as httpd.conf), it is recommended that you use it to configure Apache, because .htaccess files slow down Apache.

1. if you do not have access to the master server configuration file (as is usually the case with most WordPress shared host providers), you need to configure Apache using the .htaccess file. The first option for
2. is strictly for sysadmins because the managed service provider rarely allows you to edit the master server configuration file. Explaining how to do this in this way is beyond the scope of this article. You can refer to the sample Apache server configuration for HTML5 Boilerplate project and Apache document sharing to get started. The second option for

is ideal for most WordPress site owners because many shared hosting providers allow you to edit .htaccess files.

first looks for the .htaccess file in the root directory of the WordPress site using SFTP or the host’s online file manager. Then add the following code snippet to it.

important tip: make sure the

module is turned on on your server. Most network hosts enable it by default, but if not, themod_filterdirective will not work and may cause HTTP 500errors. If you have any problems after adding the following code snippet, you can check the server’s error log.AddOutputFilterByTypeonly adds the above code after the existing directive in the .htaccess file. Save the file and check to see if it has GZIP compression enabled on your server.

# 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  
# Remove browser bugs (only needed for ancient browsers)
BrowserMatch ^Mozilla/4 gzip-only-text/html
BrowserMatch ^Mozilla/4.0[678] no-gzip
BrowserMatch bMSIE !no-gzip !gzip-only-text/html
Header append Vary User-Agent

example Apache .htaccess files with GZIP compression enabled your Web server should now provide compressed files for all the file extensions listed above. You can confirm this using any of the methods mentioned earlier.

if you want to ensure that client-side agents and security software do not interfere with GZIP compression, you can replace the above code snippet with the following code snippet.

# force compression for clients that mangle ‘Accept-Encoding’ request headers

SetEnvIfNoCase ^ (Accept-EncodXng, X-cept-Encoding, X {15}, ~ {15},-{15}) $^ (gzip, deflate) slottery)) +, [gzip -] {4pm 13} $HAVE_Accept-Encoding
RequestHeader append Accept-Encoding “gzip,deflate” env=HAVE_Accept-Encoding

# compress all output with one of the following file extensions

AddOutputFilterByType DEFLATE “application/atom+xml”
“application/javascript”
“application/json”
“application/ld+json”
“application/manifest+json”
“application/rdf+xml”
“application/rss+xml”
“application/schema+json”
“application/geo+json”
“application/vnd.ms-fontobject”
“application/wasm”
“application/x-font-ttf”
“application/x-javascript”
“application/x-web-app-manifest+json”
“application/xhtml+xml”
“application/xml”
“font/eot”
“font/opentype”
“font/otf”
“font/ttf”
“image/bmp”
“image/svg+xml”
“image/vnd.microsoft.icon”
“text/cache-manifest”
“text/calendar”
“text/css”
“text/html”
“text/javascript”
“text/plain”
“text/markdown”
“text/vcard”
“text/vnd.rim.location.xloc”
“text/vtt”
“text/x-component”
“text/x-cross-domain-policy”
“text/xml”

# define and map media types to their appropriate encoding type
# Using SVG format (Scalable Vector Graphics) is highly recommended to
# load logos, icons, text, and simple images. You can compress .SVG files
# further using GZIP to create .SVGZ files. However, most browsers don’t
# know that they need to decompress them first if they’re not served
# without an appropriate ‘content-encoding’ HTTP response header. Thus
# these images wouldn’t show up in the browser. Hence, this module.

AddType image/svg+xml svg svgz
AddEncoding gzip svgz

You can learn more about all the instructions used here by going to its code repository and following all the resources linked in it.

enables GZIP

on Nginx Web servers according to Netcraft,Nginx is the most commonly used Web server for Web-oriented computers. If the current trend continues, it will soon overtake Apache as the most used Web server for active sites.

you can use the instructions defined in ngx_http_gzip_module to enable GZIP compression on the Nginx Web server.

first, add the instructions given below to your nginx.conf file. Typically, you can find this file in the

location of the server.

if your site provides large JS and CSS files, you can increase the buffer size for compression by adding the following directive to the nginx.conf file: don’t forget to reload Nginx after/etc/nginx/nginx.confsaves the nginx.conf file.

# enables GZIP compression
gzip on; 
# compression level (1-9)
# 6 is a good compromise between CPU usage and file size
gzip_comp_level 6;
# minimum file size limit in bytes to avoid negative compression outcomes
gzip_min_length 256;
# compress data for clients connecting via proxies
gzip_proxied any;
# directs proxies to cache both the regular and GZIP versions of an asset
gzip_vary on;
# disables GZIP compression for ancient browsers that don't support it
gzip_disable "msie6";
# compress outputs labeled with the following file extensions or MIME-types
# text/html MIME-type is enabled by default and need not be included
gzip_types
application/atom+xml
application/geo+json
application/javascript
application/x-javascript
application/json
application/ld+json
application/manifest+json
application/rdf+xml
application/rss+xml
application/vnd.ms-fontobject
application/wasm
application/x-web-app-manifest+json
application/xhtml+xml
application/xml
font/eot
font/otf
font/ttf
image/bmp
image/svg+xml
text/cache-manifest
text/calendar
text/css
text/javascript
text/markdown
text/plain
text/xml
text/vcard
text/vnd.rim.location.xloc
text/vtt
text/x-component
text/x-cross-domain-policy;

finally, you should test whether your server has GZIP compression enabled. You can refer to the Nginx documentation for an up-to-date list of all

# sets the 'number' and 'size' of buffers for GZIP compression
# default buffer size is 4K or 8K depending on the platform
gzip_buffers 16 8k;

instructions.

sudo service nginx reload

enables Internet Information Services (IIS) of GZIPngx_http_gzip_moduleMicrosoft on IIS Web servers is the third most popular Web server in use today. IIS is mainly deployed in enterprise environments running on Windows, especially for setting up company-specific intranet and extranet servers. Due to various compatibility issues,

is rarely used to host WordPress websites.

however, if you find yourself in one of the rare situations where you need to enable GZIP compression on IIS, you can refer to Microsoft’s documentation to get started. You may also find this Stack Overflow thread very helpful. An alternative to

GZIP compression the world of data compression on

networks has been improving. With the continuous increase of the average page weight, network technology is also trying to catch up with it in order to improve the efficiency of data transmission through the network.

page size increases over time (source: HTTPArchive)

in the past few years, a new compression algorithm has been popular: Brotli. Compressing WOFF2 Web fonts was initially a major concern for Brotli, but has since been extended to support compression of any type of data.

Brotli compresses data better than GZIP, but it requires more time and resources to compress data. However, its decompression time is comparable to that of GZIP, although it is still a bit slow.

Brotli supports various browsers

most browsers today support Brotli, but using it on WordPress sites is still a bit complicated. You must host your site through Brotli support or a managed service provider that allows you to install the Brotley library. Most managed WordPress hosts don’t fully support it yet, but if you use CDN such as Cloudflare or KeyCDN, you can easily enable it.

Brotli shows great potential to compress static assets. Akamai published a detailed article comparing Brotli with GZIP. You can check it for more information about Brotli.

Summary

A well-optimized network is good for everyone. Users like faster sites, site owners like lower hosting costs, and web hosts like optimizations on their servers. Compression techniques such as GZIP are one of the best ways to speed up the loading time of visitors’ pages.

WordPress site owners can speed up their sites immediately by enabling GZIP compression. For other servers, this article also introduces several ways to enable GZIP compression on various Web servers.

speed is critical to any website. Just compress it!

WordPress网站所有者可以通过启用GZIP压缩立即加速他们的网站。对于其他服务器，本文也介绍了在各种Web服务器上启用GZIP压缩的多种方法。

速度对于任何网站都至关重要。压缩就对了！