Serving Static Content

Analogy categoryAnalogies

Serving files like images, CSS, JavaScript, and HTML directly from disk is one of Nginx's core strengths. With the 'sendfile' directive enabled, Nginx uses a zero-copy kernel operation to transfer file bytes straight from the filesystem cache to the network socket without ever copying the data into user-space memory, making it dramatically faster and lighter on CPU than having an application server read and re-transmit the same static file.

🏏

Cricket analogy: Nginx serving a static file with sendfile is like a fielder throwing the ball straight to the keeper in one motion, a direct hit, instead of relaying it through two extra fielders first.

root vs alias Directives

The 'root' directive appends the matched location's URI to the given path, so 'location /images/ { root /var/www; }' serves a request for /images/cat.jpg from /var/www/images/cat.jpg. The 'alias' directive instead replaces the matched location prefix entirely, so 'location /images/ { alias /var/www/media/; }' serves the same request from /var/www/media/cat.jpg. Mixing these up, especially forgetting that alias needs the location's trailing slash accounted for, is one of the most common causes of unexpected 404 errors.

🏏

Cricket analogy: Confusing root and alias is like a scorer misreading whether extras should be added on top of the total (root, appends the path) or replace a column entirely (alias, replaces the path), producing an impossible number, a 404.

nginx

server {
    listen 80;
    server_name static.example.com;
    root /var/www/site;

    location / {
        try_files $uri $uri/ /index.html;
    }

    location /assets/ {
        alias /var/www/site/build/assets/;
        expires 30d;
        add_header Cache-Control "public, immutable";
    }

    location = /favicon.ico {
        log_not_found off;
        expires 7d;
    }
}

Caching Headers and try_files

The 'expires' directive sets the Expires and Cache-Control HTTP headers, telling browsers and intermediate caches how long they can reuse a static file without re-requesting it, which is safe to set aggressively for fingerprinted, versioned assets like 'app.a1b2c3.js'. The 'try_files' directive checks a list of paths in order and serves the first one that exists, commonly used to serve a static file if present, and otherwise fall back to /index.html for single-page applications, so client-side routing works on a hard refresh.

🏏

Cricket analogy: Setting long expires headers on static assets is like a broadcaster reusing a pre-recorded player profile graphic for the entire tournament instead of re-fetching it before every delivery, saving bandwidth since it rarely changes.

A frequent misconfiguration is using 'alias' inside a location block whose path is also referenced by 'try_files' with root-relative variables like $uri: try_files evaluates paths relative to root by default, so mixing alias and try_files in the same location without adjusting paths often produces silent 404s. Keep alias-based locations simple and avoid combining them with try_files unless you've verified the resulting path resolution.

Nginx serves static files efficiently using the zero-copy 'sendfile' kernel mechanism.
'root' appends the location's matched URI to a base path; 'alias' replaces the matched prefix entirely.
Mixing up root and alias is a common cause of unexpected 404 errors.
'expires' sets Cache-Control/Expires headers so browsers can reuse static assets without re-requesting them.
Aggressive caching is safe for fingerprinted, versioned filenames but risky for files that change without renaming.
'try_files' checks candidate paths in order and serves the first that exists, commonly used for SPA fallback routing.
Combining alias with try_files needs careful path handling to avoid silent 404s.

Practice what you learned

1. What kernel-level mechanism does Nginx use to serve static files efficiently?

2. Given 'location /images/ { root /var/www; }', which file serves a request for /images/cat.jpg?

3. What is the key difference between 'root' and 'alias' in a location block?

4. What is a common use of the try_files directive?

5. Why is aggressive long-term caching (a long 'expires' value) generally safe for fingerprinted assets like app.a1b2c3.js?

Was this page helpful?

The Nginx Configuration File Structure

Related Study Notes in DevOps

Browse all study notes

DevOps

Ansible Study Notes

DevOps · 30 topics

DevOps

Advanced Kubernetes Study Notes

Kubernetes · 30 topics

DevOps

Advanced Bash Scripting Study Notes

Bash · 30 topics

DevOps

Apache Kafka Study Notes

Kafka · 30 topics

DevOps

Docker & Kubernetes Study Notes

YAML · 40 topics

DevOps

CI/CD Tools & Pipelines Study Notes

YAML · 37 topics

Topics covered

#DevOps#NginxStudyNotes#ServingStaticContent#Serving#Static#Content#Root#StudyNotes#SkillVeris#ExamPrep

Serving Static Content