WordPress enable gzip compression.
WordPress enable GZip compression. In this post I’ll be covering how to enable GZip compression, what this does, why you might want to enable GZip compression and the benefit of doing so. GZip compression is also referred to as text compression, so this post also covers how to enable text compression.
What compression is.
Compression is the process of making a file or data smaller in size.
It takes less tme time to send a smaller amount of data over a network than it does a larger amount of data.
By using compression on your website, you can reduce the amount of data transferred when a page is requested by using compression. As the amount of data being transferred is smaller it takes less time for the data to be transferred over the network.
What browser compression is.
If you enable compression on your website, when a page is requested the page output is served to the browser in a compressed form.
The browser receives the compressed data, and then decmopresses it so that it can then use the page output to start rendering the page in the browser.
Whilst this may sound like an “additional step” that might not need to be in place, as the decompressing happens quickly, the benefits of using compression outway the additional decompression “step” undertaken by the browser.
How to enable GZip compression in WordPress.
There are a few different ways that GZip compression (or text compression) can be enabled in WordPress.
use a caching plugin.
Most caching plugins will simply have a tick option for compression or GZip compression. It;s as simple as ticking the compression box and saving the change.
In the “Browser Cache” section, tick “Enable HTTP (gzip) compression” then save your changes and clear the caches:
In WP Fastest Cache’s settings, it’s just a case of making sure you have caching enabled, ticking the GZip option, the clicking the “update” button:
You don’t need to do anything other than install this plugin, it adds GZip compression by default.
By now you’re probably getting the impression that most caching plugins provide GZip compression, and it’s just a case of ticking a box labelled GZip or compression, and then saving the change. This is pretty much the case.
It’s not that difficult to enable GZip compression and there isn’t really a downside, which is why it’s so available and easy to configure. It’s alos pretty easy to add GZip compression manaully without using a plugin.
Enable GZip compression manually.
You can enable GZip compression on your site by adding some directives to the .htaccess file(if you’re hosted on apache based hosting).
The .htaccess file is held in the document root of your site.
To add the caching policy, you’d edit the .htaccess file via the file manager in your hosting account:
And then add the following to the .htaccess file:
<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 # Remove browser bugs (only needed for really 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>
Like this:
And then save your changes.
By doing this, you’re doing what a plugin does when you tick the “compression” or “GZip” box in a caching plugin’s options.
Benefits of using compression.
Despite it being a seemingly simple change to make, there are a lot of benefits to using compression:
- Improved Lighthouse (https://gtmetrix.com/ and https://pagespeed.web.dev/) results, especially in terms of performance metrics such as “First Contentful Paint” (FCP), “Speed Index,” “Time to Interactive” (TTI), and “Total Blocking Time” (TBT).
- Faster Page Load Times. Compressed content is smaller in size, which means it can be transferred over the network more quickly. This leads to faster load times for web pages, as the reduced data size requires less time to download and render.
- Reduced Data Usage. Browser compression significantly lowers the amount of data that needs to be transmitted between the web server and the browser. This is particularly important for users on limited data plans or in regions with expensive or slow internet connections.
- Improved User Experience. Faster page load times and reduced data usage contribute to a smoother and more enjoyable browsing experience. Users can access content more quickly and navigate through websites with less waiting time.
- Optimised for Mobile Devices. Mobile devices often have more limited resources and slower network connections compared to desktop computers. Browser compression is especially beneficial for mobile users, helping them conserve battery life, reduce data costs, and browse efficiently.
- Better Performance on Slow Connections. In areas with slow or unstable internet connections, browser compression can make websites usable even when the network conditions are less than ideal. Compressed content loads more smoothly on slower connections, minimizing the frustration of waiting for pages to load.
- Support for Diverse Devices. Browser compression is valuable for various devices, from powerful desktop computers to budget smartphones and other devices with less computing power.
- Less Network Congestion. Reduced data transfer means less strain on the network infrastructure, which can help prevent network congestion and improve the browsing experience for all users.
- Lower Costs. In regions where data costs are high, browser compression can significantly reduce the expenses associated with internet usage.
- Extended Battery Life. On mobile devices, compressed content requires less processing and network activity, leading to improved battery life.
In Conclusion.
- There are various benefits to using GZip compression, ranging from faster page load times to less bandwidth overhead and improved user experience.
- There are different ways that you can enable GZip compression for your site
- GZip compression can be enabled by using a plugin
- GZip compression can also beenabled by manually updating the site’s .htaccess file.
- Of the issues flagged by tools such as GTmetrix.com and Google Pagespeed, GZip compression is one of the easier to address.