Enable Gzip Compression to Speed up your Sites – Enable Compression In Static And WordPress Sites

Enabling Compression On Websites

This is part of our guide on improving page speed using the Google page speed insights developer tool. In this article, we are discussing how to enable compression. We will be writing this article for novices using plain English and attempting to add a little more light to the explanation given by Google.

What is Enabling Data Compression?

A compressed file has had its memory reduced and therefore uses less memory. You may have come across some popular formats of compressed files that end in .zip or .rar. Almost any file can be compressed in this manner from images to program files but although these files are much smaller, they are unable to be used until they have been decompressed by the appropriate software (winzip or winrar etc).

Enable Compression

When Gzip is enabled on your website it’s compression algorithm works on Javascript, CSS inmages as well as text compression, which will reduce the size of the files increasing website performance and your Google PageSpeed Insights score.

  • Gzip compression is a method of compressing files on a web server to reduce their size before they are sent to a user’s browser.
  • When enabled, gzip compression can significantly decrease the amount of data that needs to be transferred, resulting in faster page load times.
  • It is a widely-used compression method and accepted method of compression that is supported by all major browsers.
  • Browsers and servers are very proficient and the compression and decompression speeds are so good that even on old servers it is faster to compress send and decompress data than it is to send uncompressed files.
  • Browsers inform the server if they can understand the compressed data form of its header code. If the server is told it can be read then it will send the compressed version. The browser also states which forms of compression it can understand, either Deflate, GZIP or Brotli.

Deflate, GZIP Or Brotli Compression

Deflate is the original form of compression available for websites but has long been surparsed by both GZIP and Brotli but if deflate is your only option for your server then it is better than nothing.

GZIP has a good compression ratio and is quite fast which has made it the number one choice for a long time now. It was built before the internet was live and used to compress normal files, but due to its proficiency, it soon became the best choice for internet compression.

Brotli was created by Google in 2015 and is faster than GZIP. It has an improved compression ratio too. Brotli can improve the compression of JavaScript Files by up to 14%, CSS files by up to 17%, and HTML files by up to 21% over GZIP.

Brotli is like gzip compression on your web server. But while GZIP was built to compress files Brotli was designed specifically for the web and considered by many to be better than GZIP. 

Brotli is supported on all modern browsers:

  • Chrome : As of version 5
  • Microsoft Edge : As of version 18
  • Firefox : as of version 68
  • Safari : as of version 12
  • iOS Safari : as of version 12.1

So we have discussed the different compression choices and whether deflate, GZIP or Brotli is your choice you should employ one as it will significantly enhance your site’s performance.

Most Popular Compression on the web

GZIP will compress all HTML, XML, font, JS and CSS files and is the most popular web-based compression used by far.

Of sites that use compression over 99% use GZIP

Why Use GZIP Compression on your website?

Well as we said compressed files use less memory so if you compress your site it will take less time for the user’s browser to download.  Web browsers are able to decompress the files and show them in their original state. This gives website owners a great opportunity to increase the download speed of their site and improve user experience. Many site owners already use compression so if you are not you are at a disadvantage.

The two most common compression tools are GZIP compression and Deflate compression. Gzip and Deflate have their different advantages and sometimes it is an advantage to use one over the other (1and1 prefer to use the Deflate code shown below for example).

How Does Gzip Compression Work?

  • Gzip compression works by replacing repetitive strings of text with shorter representations known as “tokens.”
  • These tokens are then stored in a lookup table on the server, reducing the overall file size.
  • When a user’s browser requests a compressed file, the server delivers the compressed version, which the browser can quickly decompress and render.

How to Enable GZIP Compression on your Static Apache Site

There are several ways of enabling compression the most common being using your .htaccess file on apache servers or your web.config file if you are on a windows server. This method works whether you are using shared hosting (allocated space on a server) or if you have a dedicated server. Because of this I will show you these methods for enabling gzip and deflate compression.

Enable Compression using .htaccess file

(if you don’t have a .htaccess file and are not sure how to create one then check out this tutorial)

Insert the following into your .htaccess file

# BEGIN GZIP
# mod_gzip compression (legacy, Apache 1.3)
<IfModule mod_gzip.c>
mod_gzip_on Yes
mod_gzip_dechunk Yes
mod_gzip_item_include file \.(html?|xml|txt|css|js)$
mod_gzip_item_include handler ^cgi-script$
mod_gzip_item_include mime ^text/.*
mod_gzip_item_include mime ^application/x-javascript.*
mod_gzip_item_exclude mime ^image/.*
mod_gzip_item_exclude rspheader ^Content-Encoding:.*gzip.*
</IfModule>
# END GZIP

Enable Deflate Compression on ionos

Copy and paste this into your .htaccess file

<IfModule mod_deflate.c>

AddOutputFilterByType DEFLATE text/plain

AddOutputFilterByType DEFLATE text/html

AddOutputFilterByType DEFLATE text/xml

AddOutputFilterByType DEFLATE text/css

AddOutputFilterByType DEFLATE application/xml

AddOutputFilterByType DEFLATE application/xhtml+xml

AddOutputFilterByType DEFLATE application/rss+xml

AddOutputFilterByType DEFLATE application/javascript

AddOutputFilterByType DEFLATE application/x-javascript

AddOutputFilterByType DEFLATE image/svg+xml

</IfModule>

New

Use Gzip On Ubuntu NGINX Site

Use the following code to activate effective compression on NGINX Sites GZIP is supported and works on Ubuntu servers.

gzip                on;
gzip_min_length     1000;
gzip_buffers        4 8k;
gzip_http_version   1.0;
gzip_disable        "msie6";
gzip_types          text/plain text/css application/json application/javascript application/x-javascript text/xml application/xml application/xml+rss text/javascript;
gzip_vary           on;

Enable Gzip Compression in WordPress to Boost Website Speed


Are you looking to improve your website’s speed? One of the most effective ways to achieve faster load times is by utilizing gzip compression. In this article, we will delve into the world of compression and show you how to enable gzip compression in WordPress to enhance your website’s performance. Let’s get started!

Enabling Gzip Compression in WordPress

Method 1: Plugin Installation

  • One of the simplest ways to enable gzip compression in WordPress is by using a compression plugin. Popular options include “WP Super Cache” and “W3 Total Cache.”
  • Install and activate the chosen plugin, navigate to the settings, and enable gzip compression.
  • Method 2: Modifying the .htaccess File
    • For advanced users comfortable with editing server files, you can manually enable gzip compression by modifying the .htaccess file (see above)
    • Add the following code to your .htaccess file:
    • Save the changes and test your website’s performance.

Configure Brotli Compression

If your server has Brotli enabled then you can enter the following into your .htaccess file to configure Brotli on your site.

<IfModule mod_brotli.c>
    AddOutputFilterByType BROTLI_COMPRESS text/html text/plain text/xml text/css text/javascript application/javascript application/x-javascript application/json application/xml
    BrotliCompressionQuality 4
</IfModule>


Check Gzip Compression


After enabling gzip compression, it is essential to test your website to ensure that the compression is working correctly.

Numerous online tools, such as PageSpeed Insights and GTmetrix, allow you to analyze your site’s performance and check if gzip compression is active.

These tools will provide you with valuable insights and suggestions for further optimization.


Benefits of Gzip Compression – Why Compress?

  • Improved Load Times: By reducing file sizes, gzip compression enables faster transfer of data, resulting in quicker page load times.
  • Bandwidth Savings: Compressed files consume less bandwidth, which can be particularly beneficial for users with limited data plans or slower internet connections.
  • Better User Experience: Faster load times enhance user experience, reduce bounce rates, and increase the likelihood of users engaging with your website’s content.

Best Practices for Gzip Compression


Ensure Browser Compatibility: Gzip compression is supported by all major browsers, so you can confidently enable it without worrying about compatibility issues.

  • Test Regularly: Periodically revisit your website’s performance using online testing tools to ensure that gzip compression is active and functioning correctly.
  • Monitor Server Resources: Gzip compression can consume CPU resources on the server. If you notice any performance issues, consider adjusting compression levels or consulting with your hosting provider.
    Bullet Point Summary:
  • Enable gzip compression to boost website speed and improve user experience.
  • Use compression plugins or modify the .htaccess file to enable gzip compression in WordPress.
  • Ensure gzip compression is active by regularly testing your website’s performance.
  • Enjoy benefits such as improved load times and bandwidth savings.
  • Remember to monitor server resources to ensure optimal performance.

I am a self-motivated, passionate website designer and developer. I have over ten years’ experience in building websites and have developed a broad skill set including web design, frontend and backend development, and SEO.

Using my growing knowledge base I have built my own company (scriptedart.co.uk) creating websites and ecommerce stores and producing custom graphics and web app functionality for a range of local businesses.

Leave a Comment

RSS
Follow by Email
Instagram
Scroll to Top