Samiksha Hiwase | 7 Min Read | June 27,2020

Enable Compression in Shopify

1. Introduction

Google gives preferential treatment to websites that are installed easily. The faster your site loads, the lower the bounce rate. If your site is strong, you have a better chance of Google ranking. Luckily, Google also provides free tools to figure out what you need to repair.
Enabling GZIP compression can help to reduce the size of your webpage, which can significantly reduce the amount of time to download the resource, reduce data usage for the client, and improve the speed of your site.
There are 2 ways to make your files smaller: Minifying and Compressing them.
Minifying scripts and stylesheets remove all the excess spacing and code comments in the actual files to maximum the compact of the code and file size.
Compressing files makes them lighter to transfer from your server.
You can use Gzip, a file compression software application, to reduce the size of your CSS., HTML, and Javascript files. Utilize Gzip for the files more than 150 bytes. But do not use Gzip for image files. Compress images in a system like Photoshop where you can maintain control of the image quality.

2. What is Gzip Compression?

You may already be compressing images of your site, but you are not also compressing the code. By enabling Gzip compression, you can compress the files for additional page speed enhancements.
When a user enters your website URL and clicks on enter, a call is made to your server to deliver the requested files. The larger these files, the longer time it will going to take to get to your browser and appear on the screen.
Gzip compresses your webpages and style sheets before sending them over to the browser. This drastically reduces transfer time because the files are much smaller in size.
Compression is a technique that allows the web server and browser to agree on a common compression format (Gzip) and transfer much lighter files. Gzip is a file format and a software application used for file compression and decompression.
GZIP compression is enabled at the server-side and allows for further reduction in the size of your HTML, stylesheets, and JavaScript files. In terms of cost versus benefit, compression should be near to the top of your page speed optimizations if you don’t have it set up already.
Google says Gzip compression can reduce the size of the transferred response by up to 90%.

3. How does Gzip work?

Gzip locates the same strings within a text file and replaces those strings temporarily to make the overall file size smaller. The reason behind Gzip works so well in a web environment because the CSS, HTML, and Javascript files use a lot of repeated text, comments, and have a load of whitespace.
Since Gzip compresses common strings, this can reduce the size of pages.
When a browser visits a webserver first it checks to see if the server has Gzip enabled and requests the webpage. If it’s enabled it receives the Gzip file which is significantly smaller and if it isn’t, it still receives the page, only the uncompressed version which is much larger.
Gzip has to be enabled on your web server because it works relatively in a straight forward method.

Why Gzip is important?

The main reason Gzip is important is it reduces the time which is required by the server to transfer the page files and style sheets for your website.
Gzip ultimately also reduces the load time of your website.

4. How to enable compression in Shopify:-

The Gzip files compression handled on the server-side. If you are on a Shopify site, your files are likely already compressed.
If you want to test your Shopify site, there are many tools available for testing sites. For example- GTmetrix, Page Speed Insights, etc. You can select any tool to perform testing of your site.
Let’s consider you test your site on Page Speed Insights and getting Enable compression warning, then it’s likely because of a file from a third-party app. In this case, you can email the app support and ask if they can compress their files.

Gzip Warning in Google PageSpeed Insights

Google says that compressing resources with GZIP can reduce the number of bytes sent over the network.
You can see the Enable compression warning in Google PageSpeed Insights in the image.

Gzip Warning in GTmetrix

You can take a look at the Enable GZIP compression warning in GTmetrix in the image.

5. Summary

Remember Gzip also applies to your static assets as well. This means if you are serving assets from a CDN, you will want to ensure they also have Gzip compression enabled files. All modern CDN providers support Gzip compressions, such as Cloudflare, KeyCDN, and CloudFront.
You can also easily test this by simply running one of your CSS or JavaScript files on your CDN through the tool.

For Further Details or Additional Information

OR

If you want to know more about our Services