How to Enable GZIP Compression in WordPress
There is a myriad of factors which can affect user experience. The major one is likely content, but even top-notch content may not be enough if your website scores poorly in terms of user experience. Don’t worry, though: a lot of things can be done in terms of improving user experience. Some of them, like ease of navigation, are a little abstract (if they work well, nobody will notice them), and some, such as website accessibility, may even involve redesigning some of your website’s features. Website speed is one of the former.
In this article, we will be discussing a way to improve your website speed: GZIP, and show you how to implement it in WordPress. But what is GZIP compression? How does it work? Does your website really need it? We will be answering all of these questions in the article below. Here are the topics we will be touching upon in our exploration of GZIP and WordPress:
Qode Themes: Top Picks
View Collection
The clue is in the name: it is a way of compressing data – in this case, website data – making it smaller and therefore faster to load. But that doesn’t answer the main thrust of the question.
Data compression itself is well beyond the scope of this article, but for the purposes of addressing GZIP in particular, we will say that preferred methods of compression largely depend on the type of data you want compressed. You wouldn’t use the same methods to optimize images and minify CSS and JavaScript, for instance, but the purpose is the same.
GZIP is short for GNU Zip, and is currently the most popular lossless compression algorithm. It works advanced mathematical magic and can compress any file type, but works best with HTML, CSS, JavaScript, and other text-based files.
Apart from being an algorithm, it is also a piece of software used for compression and decompression, and a file format. The file resulting from GZIP compression typically has .gz for its suffix.
As for how it works, we can’t go very deep into that without getting too technical. We will say that it uses an algorithm called LZ77 to detect redundancies (repeated places in the text) and replace them with ordered sequences of elements known as tuples in mathematics. It then uses another algorithm known as Huffman coding to compress the result even more, reencoding more frequent characters with fewer bits than those less frequent.
This combination of LZ77 and Huffman coding creates the .gz file mentioned above. The resulting file may be reduced down to 10% of the original’s size, though this varies.
If you are not convinced by the possibility of reducing your file sizes (and, consequently, loading speeds), let us discuss some additional benefits of GZIP.
First, you should take note that, in order to display the website to a user, the browser has to decompress the .gz file in order to execute it. And, while GZIP may not be the most efficient method of storing data, its combined algorithms are so refined as to be by far the fastest yet developed, both ways: compressing and decompressing. So, while there may be more efficient ways of making your files smaller, you could still lose out on the loading speed.
Secondly, it is free and open source. This means that it does not require a paid license agreement to use. It was originally developed as a free alternative to paid solutions, which is part of the reason why it is so widespread.
Thirdly, it is resistant to entropy encryption. If a file is already efficiently organized or very small, applying a compression algorithm to it can result in increasing the size of the file, rather than the other way around, as the encryption dictionary gets added to it. With GZIP, this rarely happens, and the effects are not as adverse as with some other compression algorithms.
Finally, the compression itself: while there are more efficient algorithms in terms of file size reduction, GZIP is still very efficient in that respect, being capable of reducing textual file sizes by 70 to 90%.
It is therefore no surprise that GZIP sees widespread usage in various fields, from image compression (such as in .png) through console gaming, where every bit and hertz count, all the way to some of the most popular operating systems. In terms of application to websites, GZIP can improve your website’s loading speed significantly, resulting in positive effects on your SERP ranking and user experience.
Since GZIP is so widely used and supported, many hosting providers enable it by default. Still, it may happen that GZIP compression is not used on your server.
To check that, you can use any number of online tools. For this demonstration, we have opted for Sitechecker Pro’s GZIP checker. Simply follow the link, enter the URL for which you wish to check GZIP compression, and click the arrow icon. We have gone with Qode Magazine’s URL.
As you can see, GZIP compression is enabled. Sitechecker will also inform you of how efficient the compression was. In our case, it is over 90%.
Most website speed checking tools, such as PageSpeed Insights, will serve you with an alert message in case GZIP compression is not enabled.
Finally, you could use your browser’s inspect tool to check whether GZIP coding is enabled. We will be testing our own website.
Activate the inspect tool by right-clicking anywhere (the background, in our case), and selecting Inspect to open the console.
Once there, find the Network tab and click it.
Finally, locate the HTML document and check its Headers section for the content-encoding: gzip and accept-encoding: gzip headers.
As is most often the case, a needed functionality can be provided using a WordPress plugin. For this demonstration, we have selected the free WP-Optimize plugin. After installing and activating the plugin, navigate to WP-Optimize/Cache from your WordPress dashboard.
Once there, select the Gzip compression tab and click the Enable button.
And, just like that, you have enabled GZIP compression on your website.
If you are using an Apache server (currently the commonest), you can use FTP to edit your configuration files in order to enable GZIP compression on your website. Note that while WordPress is very user-friendly, we cannot recommend code editing for beginner users.
Simply find the .htaccess file in your root WordPress directory and add the following code after the existing directives:
<IfModule mod_deflate.c> # Compress HTML, CSS, JS, text, XML and font files 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 # Fix browser bugs on old 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 </IfModule>
Note that the above code will only be executed if the mod_filter module is active on your server. Contact your hosting provider for details on that.
Sometimes, other software (proxies, firewalls, and other security software) may interfere with GZIP compression by disallowing accept-encoding headers. To ensure this doesn‘t happen, use the following code instead of the one given above:
"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" </IfModule> <IfModule mod_mime.c> AddType image/svg+xml svg svgz AddEncoding gzip svgz </IfModule> </IfModule>
In case you are using an Nginx server (the second most popular server), you need to edit the nginx.conf file, typically found at etc/nginx/nginx.conf on your server.
You need to add the following instructions to it:
# Enables GZIP gzip on; # Compression level (set within range of 1 to9) gzip_comp_level 9; # Minimum file size to compress gzip_min_length 256; # Compress data for clients using proxies gzip_proxied any; # Proxies to cache regular and GZIP versions of files gzip_vary on; # Disables GZIP compression for browsers which don't support it gzip_disable "msie6"; # Compress files with following extensions or MIME-types 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;
Once you have done that, you will need to reload Nginx before the instructions are executed using the following command:
sudo service nginx reload
In Conclusion
If there is a quick way of improving your website‘s user experience, there is no reason not to try it. If there is a quick way of making your website rank better in searches, there is no reason not to try it. If there is a quick way of ensuring speedier loading and smoother running of your website, there is no reason not to try it. GZIP compression is all three.
