What is gzip compression?

When a user hits your website a call is made to your server to deliver the requested files. The bigger these files are the longer it’s going to take for them to get to your browser and appear on the screen.

Gzip compresses your web pages and style sheets before sending them over to the browser. This drastically reduces transfer time since the files are much smaller. The reason gzip works so well in a web environment is because CSS files and HTML files use a lot of repeated text and have loads of whitespace. Since gzip compresses common strings, this can reduce the size of pages and style sheets by up to 70%!

Enable Gzip Compression for Apache (cPanel user)

Be sure you have a recent, good backup of your site you can use to restore from if an update or upgrade goes horribly wrong.

As a bare minimum, you add the following in your .htaccess. To do this, simply access your hosting cPanel, and with your File Manager to do the update. Steps as below:

  • Access the File Manager by clicking on the File Manager icon within your cPanel. This can be quickly located by typing File Manager into the search bar at the top of the cPanel.
  • In the top right of the screen, click the settings button. Ensure the option that states Show Hidden Files is checked and click save at the bottom of the window.
  • Once you can see your hidden dot files, navigate to the domain’s file path by right clicking the .htaccess file, and then selecting Edit.
  • Once in the edit mode for the .htaccess file, paste the following codes on a new line within 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>
    
  • After the code above has been added to the .htaccess file, Do not make any other changes, click the save button at the top right corner of the screen. Congrats! You have now enabled the Gzip Compression!
SHARE
Previous articleWhy Choose To Start with Plesk Onyx Server Panel
Next articleWordPress 5.1 – What’s new?
Vickson Tan
Join Exabytes family since 2006 and grow the company together with team, from hosting company to cloud services company. Providing all cloud solutions to SMEs and Grow their business online. https://www.linkedin.com/in/vicksontan/