Mastering Strong and Conditional Caching with Nginx: Best Practices and Config Examples

1. Strong Cache

1. Definition

• Strong cache tells the browser that before the cache expires, no communication with the server is needed; use the local cache directly.

• Controlled by response headers Cache-Control and Expires.

2. Response Headers

Cache-Control: max-age=3600

means the resource is valid for 3600 seconds (higher priority than Expires). Expires: Thu, 31 Dec 2030 23:59:59 GMT sets an absolute expiration time (depends on client clock).

3. Nginx Configuration Example

location /static/ {
    # Set strong cache: valid for 1 year
    add_header Cache-Control "public, max-age=31536000";
    expires 1y;
}

4. Behavior

• On first request, server returns resource with cache headers.

• Subsequent requests read from local cache (status code 200 (from disk cache)) without contacting the server.

5. Use Cases

• Static resources that rarely change, such as CSS, JS, images, fonts.

2. Negotiated Cache (Weak Cache)

1. Definition

• Negotiated cache requires the browser to validate the cache with the server each time; if not expired, the server returns 304 Not Modified and the browser continues using the local cache.

• Controlled by response headers Last-Modified and ETag.

2. Response Headers

Last-Modified: Wed, 21 Oct 2023 07:28:00 GMT

indicates the last modification time (second precision, may fail if clocks differ). ETag: "5d8c72a5-264" is a unique identifier (hash or version), more precise.

3. Nginx Configuration Example

location /dynamic/ {
    # Enable negotiated cache (default support)
    add_header Last-Modified "";
    etag on;
}

4. Behavior

First request returns resource with Last-Modified or ETag.

Subsequent requests send If-Modified-Since: [Last-Modified value] or If-None-Match: [ETag value] to the server.

If unchanged, server responds 304 Not Modified; otherwise a new resource with status 200 is returned.

5. Use Cases

• Frequently updated resources such as HTML pages or dynamic API responses.

3. Key Differences

Communication cost : Strong cache – no network request; Negotiated cache – request needed to validate.

Response status code : Strong cache – 200 (from disk cache); Negotiated cache – 304 Not Modified.

Priority : Strong cache takes precedence; Negotiated cache triggers after strong cache expires.

Applicable resources : Strong cache – long‑unchanging static assets; Negotiated cache – frequently updated dynamic assets.

4. Nginx Best Practices

Combine both caches

location / {
    # Strong cache for 1 hour, then fall back to negotiated cache
    add_header Cache-Control "public, max-age=3600";
    etag on;
}

Differentiate by file type

# Images, fonts – strong cache
location ~* \.(jpg|png|gif|woff2)$ {
    expires 1y;
    add_header Cache-Control "public, max-age=31536000";
}
# HTML – disable strong cache, always negotiate
location ~* \.html$ {
    add_header Cache-Control "no-cache, must-revalidate";
}

Handle cache updates • Use filename hashing (e.g., main.abcd1234.js ) for strong‑cache assets. • Change ETag or Last-Modified to trigger updates for negotiated cache.

5. Debugging Tools

Browser devtools (Network tab) – check status 200 (from disk cache) for strong cache or 304 Not Modified for negotiated cache, and inspect Cache-Control, If-Modified-Since, If-None-Match headers.

Command line: curl -I http://example.com/resource.js Properly configuring strong and negotiated caching can significantly improve website performance and reduce server load.