Cache invalidation strategies in Express - Performance & Optimization

Performance: Cache invalidation strategies

HIGH IMPACT

Cache invalidation strategies affect how quickly updated content is served, impacting page load speed and user experience.

Serving updated API responses with caching

Express

app.get('/data', (req, res) => {
  const data = getDataFromDb();
  res.set('Cache-Control', 'no-cache'); // forces revalidation
  res.json(data);
});

Forces client to revalidate cache on each request, ensuring fresh data without long stale periods.

📈 Performance GainImproves LCP on updates by avoiding stale content, with minimal revalidation overhead.

Serving updated API responses with caching

Express

app.get('/data', (req, res) => {
  res.set('Cache-Control', 'max-age=86400'); // cache for 1 day
  res.json(getDataFromDb());
});

Caches data for a long time without invalidation, causing stale content to be served even after updates.

📉 Performance CostImproves initial load but causes poor LCP on updates due to stale data until cache expires.

Performance Comparison

Pattern	DOM Operations	Reflows	Paint Cost	Verdict
Long max-age without invalidation	Minimal	0	Low initially, high on update delay	[X] Bad
No-cache header forcing revalidation	Minimal	0	Moderate due to revalidation	[!] OK
Static ETag header	Minimal	0	Low initially, high stale risk	[X] Bad
Dynamic ETag with 304 responses	Minimal	0	Low, efficient network usage	[OK] Good
Cache with no invalidation on update	Minimal	0	Low initially, high stale risk	[X] Bad
Cache invalidated on data update	Minimal	0	Low, fresh content	[OK] Good

Rendering Pipeline

Cache invalidation affects the critical rendering path by controlling when fresh data is fetched and rendered, impacting the timing of content paint.

→Network

→JavaScript Execution

→Layout

→Paint

⚠️ BottleneckNetwork latency and blocking caused by stale cache or forced revalidation.

Core Web Vital Affected

LCP

Cache invalidation strategies affect how quickly updated content is served, impacting page load speed and user experience.

Optimization Tips

1Use dynamic ETag or Last-Modified headers for efficient cache validation.

2Avoid long cache durations without invalidation to prevent stale content.

3Invalidate server-side caches explicitly when data changes to keep content fresh.

Performance Quiz - 3 Questions

Which cache invalidation strategy best reduces data transfer while ensuring fresh content?

A Setting Cache-Control max-age to a very long time without invalidation

B Using static ETag headers that never change

C Using dynamic ETag headers with conditional 304 responses

D Disabling cache completely with no-cache header

DevTools: Network

How to check: Open DevTools > Network tab, reload the page, and inspect response headers for Cache-Control, ETag, and status codes like 304.

What to look for: Look for 304 Not Modified responses indicating efficient cache validation and minimal data transfer.