Article sections

    Smaller file sizes help you to achieve faster loading time on your WordPress Site. The size of your webpage can be reduced by using Gzip compression.

    Gzip Compression reduces the size of HTML files, JavaScripts, CSS stylesheets and XML files.

    Also, google alerts for sites that do not have compression enabled. In this guide, you will learn how to enable Gzip compression to your WordPress website by modifying the .htaccess file.


    How does Gzip Compression Work?


    The working of Gzip compression is very simple. It uses an algorithm which organizes repeated strings in a single place only, instead of saving those same strings again and again.

    And it manages those strings with their location values while compression and retrieving data back from compressed files. Gzip compression works fine with stylesheets and web pages because all these resource files have many repeated strings. Because of its compression technique, Gzip can reduce the file size by 70-90%.

    When a browser visits a webserver it checks to see if the server has gzip/Brotli enabled and requests the webpage. If it’s enabled it receives the gzip/Brotli file which is significantly smaller and if it isn’t, it still receives the page, only the uncompressed version which is much larger.

    How to Enable Gzip Compression

    For Apache

    You will need to add the following lines to your .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>
    

    For Nginx

     

    gzipon;
    gzip_comp_level2;
    gzip_http_version1.0;
    gzip_proxied any;
    gzip_min_length1100;
    gzip_buffers168k;
    gzip_types text/plain text/html text/css application/x-javascript text/xml application/xml application/xml+rss text/javascript;
    gzip_disable"MSIE [1-6].(?!.*SV1)";
    gzip_varyon;

    Click on Save Changes to save your changes.

    Using Plugin


    There are WordPress plugins available which can help to enable to Gzip compression to your site. W3 Total Cache is one of the most used popular caching plugins on WordPress. Using this plugin, you can enable Gzip compression.

    You can enable Gzip compression with W3 Total cache by going to its settings page. Go to the Browser cache page. Enable the HTTP compression option and click on Save Changes.

    in WordPress
    Did this article answer your question?

    Leave a Reply