High‑Performance Static Site Configuration with Nginx: Caching, Gzip, CORS and Anti‑Hotlinking

Overview – The author shares four key Nginx configuration topics—caching, gzip compression, cross‑origin resource sharing (CORS), and anti‑hotlinking—based on production experience to help readers build high‑performance static sites.

Cache

Proper cache settings let browsers reuse previously fetched resources, reducing server round‑trips and improving user experience.

Cache directives can use positive or negative values. The Cache-Control header is set via the Expires value; a negative value means no‑cache , while a non‑negative value means max‑age=time .

location ~* \.(jpg|jpeg|png|gif)$ {
    expires 30d;
}
# expires 30s;   # cache 30 seconds
# expires 30m;   # cache 30 minutes
# expires 2h;    # cache 2 hours
# expires 30d;   # cache 30 days

Principle Analysis

The caching process involves the client requesting a resource, the server responding with cache headers (Expires, Cache‑Control), the browser storing the response, and subsequent requests checking the local cache before contacting the server. If the cached file is still valid (not expired, ETag or Last‑Modified unchanged), the server may return 304 Not Modified and the browser serves the cached copy.

Header Explanation

Cache‑Control – Takes precedence over Expires and defines directives such as public , max‑age , etc.

Expires – HTTP/1.0 header indicating an absolute expiration time; superseded by Cache‑Control in HTTP/1.1 due to clock‑skew issues.

Gzip Module

Enabling gzip compression reduces the amount of data transferred, speeding up page loads.

location ~ .*\.(jpg|gif|png|js)$ {
    gzip on;
    gzip_http_version 1.1;
    gzip_comp_level 2; # compression level (1‑9)
    gzip_types text/plain application/javascript application/x-javascript text/css application/xml text/javascript application/x-httpd-php image/jpeg image/gif img/png;
}

CORS and Anti‑Hotlink

These settings improve security by allowing only authorized domains to access resources and preventing other sites from hot‑linking static assets.

server {
    listen 80;
    server_name www.stark.com;
    location / {
        add_header 'Access-Control-Allow-Origin' 'http://stark1.com https://stark2.com';
        add_header 'Access-Control-Allow-Methods' 'GET, POST, OPTIONS';
        add_header 'Access-Control-Allow-Headers' 'User-Agent,Keep-Alive,Content-Type';
        add_header 'Access-Control-Max-Age' 1728000;
        if ($request_method = 'OPTIONS') {
            add_header 'Access-Control-Allow-Origin' '*';
            add_header 'Access-Control-Allow-Methods' 'GET, POST, OPTIONS';
            add_header 'Access-Control-Allow-Headers' 'User-Agent,Keep-Alive,Content-Type';
            add_header 'Access-Control-Max-Age' 1728000;
            add_header 'Content-Type' 'text/plain charset=UTF-8';
            add_header 'Content-Length' 0;
            return 204;
        }
    }
}

Anti‑hotlinking checks the Referer header and blocks requests from unauthorized domains.

server {
    listen 80;
    server_name yourdomain.com;
    location / {
        root /path/to/your/files;
        valid_referers none blocked server_names *.yourdomain.com;
        if ($invalid_referer) {
            return 403;
        }
    }
}

The article concludes with a call for discussion and invites readers to join related communities, but the technical content above provides a complete guide for configuring Nginx for high‑performance static sites.