Serving from multiple directories in Express - Performance & Optimization

Performance: Serving from multiple directories

MEDIUM IMPACT

This affects how quickly static files are served and how many file system checks the server performs, impacting page load speed and responsiveness.

Serving static files from multiple directories in an Express app

Express

const path = require('path');
app.use(express.static(path.join(__dirname, 'combinedPublic')));

Combining static files into a single directory reduces file system lookups to one per request.

📈 Performance GainSingle file system check per request, reducing response time and improving LCP.

Serving static files from multiple directories in an Express app

Express

app.use(express.static('public1'));
app.use(express.static('public2'));
app.use(express.static('public3'));

Express checks each directory in order for every file request, causing multiple file system lookups and delays.

📉 Performance CostTriggers multiple file system checks per request, increasing response time and delaying LCP.

Performance Comparison

Pattern	File System Checks	Response Delay	Impact on LCP	Verdict
Multiple static directories	Multiple per request	Higher delay	Negative impact	[X] Bad
Single combined static directory	One per request	Lower delay	Improves LCP	[OK] Good

Rendering Pipeline

When serving static files, the server must locate the requested file before sending it. Multiple directories cause repeated file system checks, delaying the server response and thus delaying the browser's ability to start rendering.

→Network Request Handling

→File System Access

→Response Sending

⚠️ BottleneckFile System Access due to multiple directory lookups

Core Web Vital Affected

LCP

This affects how quickly static files are served and how many file system checks the server performs, impacting page load speed and responsiveness.

Optimization Tips

1Minimize the number of static directories to reduce file system lookups.

2Combine static assets into a single directory when possible.

3Use caching and CDN to further reduce server file access delays.

Performance Quiz - 3 Questions

What is a main performance drawback of serving static files from multiple directories in Express?

A It causes more CSS reflows in the browser

B Multiple file system lookups per request increase response time

C It increases the bundle size sent to the client

D It blocks JavaScript execution on the client

DevTools: Network

How to check: Open DevTools, go to Network tab, reload the page, and observe the time to first byte (TTFB) and resource load times for static files.

What to look for: Look for increased TTFB or delays in loading static assets indicating multiple file system lookups or slow server response.