How To Enable GZIP Compression on Laravel Forge

Posted on May 01, 2018

If you are using Laravel Forge and trying to optimize your website performance, you’ve probably received the ‘Enable Compression’ warning from Google Pagespeed Insights.

how-to-enable-compression-laravel-forge.png

This guide provides detailed instructions on how you can solve this common problem with a simple change to your NGINX configuration.

To prove that this actually works, we will optimize leaderapps.xyz so you can see first hand How To Enable GZIP Compression on Laravel Forge.

Try PageSpeedPlus Now

Contents

Measure Initial Page Speed

Our first step is to measure the current score by running the site through Google PageSpeed Insights. Our domain leaderapps.xyz scores a lowly 60 on mobile and one of the things that Google suggests we should do is Enable Compression.

enable-compression-pagespeed-score.png

Enable compression on Laravel Forge Explained

The only action required is make a simple edit in the nginx.conf file for your domain.

Go to sites > your site

select-site.jpg

Scroll to the bottom and go to Edit Files > Edit Nginx Configuration

edit-nginx-config.png

Inside the server block paste the following snippet:

    #GZIP
    # Enable gzip compression.
    gzip on;

    # Compression level (1-9).
    # 5 is a perfect compromise between size and CPU usage, offering about
    # 75% reduction for most ASCII files (almost identical to level 9).
    gzip_comp_level    5;

    # Don't compress anything that's already small and unlikely to shrink much
    # if at all (the default is 20 bytes, which is bad as that usually leads to
    # larger files after gzipping).
    gzip_min_length    256;

    # Compress data even for clients that are connecting to us via proxies,
    # identified by the "Via" header (required for CloudFront).
    gzip_proxied       any;

    # Tell proxies to cache both the gzipped and regular version of a resource
    # whenever the client's Accept-Encoding capabilities header varies;
    # Avoids the issue where a non-gzip capable client (which is extremely rare
    # today) would display gibberish if their proxy gave them the gzipped version.
    gzip_vary          on;

    # Compress all output labeled with one of the following MIME-types.
    gzip_types
      application/atom+xml
      application/javascript
      application/json
      application/ld+json
      application/manifest+json
      application/rss+xml
      application/vnd.geo+json
      application/vnd.ms-fontobject
      application/x-font-ttf
      application/x-web-app-manifest+json
      application/xhtml+xml
      application/xml
      font/opentype
      image/bmp
      image/svg+xml
      image/x-icon
      text/cache-manifest
      text/css
      text/plain
      text/vcard
      text/vnd.rim.location.xloc
      text/vtt
      text/x-component
      text/x-cross-domain-policy;
    # text/html is always compressed by gzip module

Here's a screenshot of our Forge Nginx config afterwards:

forge-config-screenshot.png

Click Save

Restarting

We have to reload or restart Nginx for the config change to propagate. Forge makes it easy to restart from the UI so at the top of the page locate the dropdown for:

Servers > Your Server

Go to the bottom of the page and click:

Restart > Restart Nginx.

Quick Tip - For an even quicker boost, pass your web traffic through CloudFlare and see what it does for pagespeed

Finished

Done! That’s everything needed to successfully Enable Compression of the static assets on your website. Refresh the front end to see if everything is good and make sure you haven’t left a syntax error in the config file.

Test If Compression Is Enabled

For absolute certainty you should check if GZIP Compression is enabled by running your site through Varvy’s useful GZIP Compression Test.

enable-compression-varvy-test-result.png

Measure The Improvement

Pagespeed caches results for 30 seconds so after that, test your site again to see what difference it made to the score.

enable-caching-pagespeed-results.png

As you can see we jumped a massive 18 Pagespeed points to 78. This change alone takes our desktop ranking above 80 and into the green zone.

In comparison, just think of all the hours you spent trying to optimize images, serve them image in next-gen format and improve CSS delivery for a minimal gains. With this change we have bypassed so much hard work and got ourselves a fast site.

How It Works

This code snippet will instruct Nginx to use gzip to compress files it serves on the fly. This means a smaller amount of data is transferred when a user requests a webpage from your server meaning it can get there quicker. When it arrives at the browser, the data is decompressed with no loss of quality and the code is rendered to display your site.

Benefits

Adding this code to your Nginx config will instantly accelerate your website and reduce the load time for users on all devices. More importantly, it shows that you pay attention to the technical quality of your domain meaning Google will view it in a more positive light. The difference this makes to your ranking is impossible to predict but if you are meeting another one of Googles directives it will only bring benefits as opposed to not doing it.

Conclusion

In this post you learned How To Enable Compression With Laravel Forge by adding a section to your Nginx config. This will boost your site speed and may elevate your position in the SERPs. If you want to monitor your PageSpeed Insights score, consider using PageSpeedPlus to automatically check it every day and notify you when the score drops.

Try PageSpeedPlus Now

You might also like