Enable Expires Headers and Gzip Compression on Nginx

Introduction

Nginx is a fast and lightweight web server that can be further optimized to improve website performance.

In this article, we will explain how to enable Expires headers for static files and Gzip compression on Nginx. These settings can help improve page loading performance by allowing browsers to cache static content and reducing the size of files transferred between the server and client.

Prerequisites

Before proceeding, make sure you have:

1. Nginx installed on the server.
2. A CentOS or Ubuntu server.
3. Root or sudo access.
4. Nginx configuration files available under /etc/nginx/.

If Nginx is not installed, install and configure it before proceeding.

Implementation

1. Enable Expires Headers on Nginx

Expires headers allow browsers to cache static files for a specified period. This can reduce repeated requests to the server and improve website performance.

In this example, we will configure caching for the following static file types:

ico | css | js | gif | jpg | jpeg | png

Open the website’s Nginx configuration file:

vi /etc/nginx/sites-enabled/default

Add the following configuration inside the server {} block:

location ~* \.(?:ico|css|js|gif|jpe?g|png)$ {
    expires 30d;
    add_header Pragma public;
    add_header Cache-Control "public";
}

The expires 30d; directive tells the browser to cache the specified static files for 30 days.

Check the Nginx configuration for syntax errors:

nginx -t

If the configuration test is successful, restart Nginx:

systemctl restart nginx

Verification

Use curl to check whether the Expires header is being returned:

curl -I http://domain.tld/css/assets.min.css

You should see a response similar to:

Date: Wed, 28 Dec 2016 05:51:07 GMT
ETag: "585cede3-4d843"
Expires: Fri, 27 Jan 2017 05:51:07 GMT
Last-Modified: Fri, 23 Dec 2016 09:26:59 GMT

The presence of the Expires header confirms that browser caching has been configured.

2. Enable Gzip Compression

Gzip compression reduces the size of text-based files before they are sent to the client. This can reduce bandwidth usage and improve page loading times.

Open the Nginx configuration file:

vi /etc/nginx/nginx.conf

Add or update the following configuration:

gzip on;
gzip_disable "msie6";
gzip_vary on;
gzip_types text/plain text/css application/json application/javascript text/xml application/xml application/xml+rss text/javascript image/x-icon image/svg+xml;

Check the Nginx configuration:

nginx -t

If there are no errors, restart Nginx:

systemctl restart nginx

Verification

Use the following command to check whether Gzip compression is enabled:

curl -I -H "Accept-Encoding: gzip" https://domain.tld/css/asset.min.css

You should see:

Cache-Control: max-age=2592000
Cache-Control: public
Content-Encoding: gzip

The Content-Encoding: gzip header confirms that the response is being compressed using Gzip.

Conclusion

Enabling Expires headers and Gzip compression on Nginx can help improve website performance.

Expires headers allow browsers to cache static resources, reducing repeated requests to the server. Gzip compression reduces the size of supported responses, which can help reduce bandwidth usage and improve transfer times.

After making any Nginx configuration changes, always run nginx -t before restarting or reloading the service.

FAQs

1. What are Expires headers?

Expires headers tell the browser how long a static resource can be cached before it needs to request it again from the server.

2. How long are static files cached in this configuration?

The configuration uses expires 30d, so the specified static files are cached for 30 days.

3. What is Gzip compression?

Gzip is a compression method that reduces the size of supported HTTP responses before they are sent to the client.

Related Article

How to setup SSL Certificate in Nginx on Ubuntu 20.04 – Pheonix Solutions

How to install and configure PHP with Nginx on centos7 – Pheonix Solutions

Talk to our experts

Have a technology challenge or looking for the right solution for your business? Our team can help you with cloud, DevOps, development, infrastructure, design, and more. Feel free to reach out to our experts here.