[Atomic Glue](atomicglue.co)
PERFORMANCE
Home › Glossary › Performance· 59 ·

Browser Caching

/ˈbraʊzər ˈkæʃɪŋ/n.
Filed underPerformanceInfrastructure
In brief · quick answer

Storing previously downloaded resources on the user's device so subsequent page loads (or return visits) can skip network requests entirely.

§ 1 Definition

Browser caching stores HTTP responses locally on the user's device based on Cache-Control and ETag/Last-Modified headers. Well-cached resources eliminate HTTP requests entirely on repeat visits (cache hit) or validate with a lightweight 304 Not Modified response. Effective browser caching is the difference between a 300 ms page load and a 3 second one on return visits.

§ 2 Cache Headers

Cache-Control: max-age (seconds until stale), immutable (never re-validate), no-cache (always re-validate), no-store (never cache). ETag provides a content fingerprint for conditional revalidation. Last-Modified provides a timestamp-based fallback. For versioned assets (content-hashed filenames), use max-age=31536000 and immutable.

§ 3 Common Misunderstandings

Back/forward cache (bfcache) is NOT the same as HTTP cache. bfcache stores the entire page state (JS heap included) in memory for instant back/forward navigation. HTTP cache stores individual resources on disk. Both matter, but they serve different scenarios. Also, private browsing mode still uses in-memory caching but typically reduces cache duration.

§ 4 Optimization Tips

Version all static assets with content hashes. Set max-age to 1 year for versioned assets with the immutable directive. Use no-cache for HTML pages to ensure freshness while benefiting from conditional revalidation. Use ETags for validation. Avoid no-store unless the content contains sensitive data (bank transactions). Preload cacheable resources in the <head>.

§ 5 Note

Browser storage is limited per origin (typically 10-50 MB for disk cache). Safari and Chrome have different eviction policies. Service Workers can augment browser caching with programmatic control via the Cache Storage API.

§ 6 In code

# Versioned CSS/JS: cache forever
Cache-Control: public, max-age=31536000, immutable

# HTML: always revalidate but can use ETag
Cache-Control: public, no-cache
ETag: "abc123"

§ 7 Common questions

Q. Is browser cache cleared when the user clears history?
A. Yes. Browser cache is typically cleared alongside browsing data. Service Worker caches are sometimes preserved separately.
Key takeaways
  • Stores resources on the user's device.
  • Cache-Control headers govern behavior.
  • Use content hashes for long-lived caching.
  • Return visitors benefit most.
How Atomic Glue helps

Atomic Glue audits browser cache configuration, sets optimal headers, and implements Service Worker caching for resilient offline experiences. Web Development services.

Get in touch
# Browser Caching

Storing previously downloaded resources on the user's device so subsequent page loads (or return visits) can skip network requests entirely.

Category: Performance (also: Infrastructure)

Author: Atomic Glue Performance Team

## Definition

Browser caching stores HTTP responses locally on the user's device based on Cache-Control and ETag/Last-Modified headers. Well-cached resources eliminate HTTP requests entirely on repeat visits (cache hit) or validate with a lightweight 304 Not Modified response. Effective browser caching is the difference between a 300 ms page load and a 3 second one on return visits.

## Cache Headers

Cache-Control: max-age (seconds until stale), immutable (never re-validate), no-cache (always re-validate), no-store (never cache). ETag provides a content fingerprint for conditional revalidation. Last-Modified provides a timestamp-based fallback. For versioned assets (content-hashed filenames), use max-age=31536000 and immutable.

## Common Misunderstandings

Back/forward cache (bfcache) is NOT the same as HTTP cache. bfcache stores the entire page state (JS heap included) in memory for instant back/forward navigation. HTTP cache stores individual resources on disk. Both matter, but they serve different scenarios. Also, private browsing mode still uses in-memory caching but typically reduces cache duration.

## Optimization Tips

Version all static assets with content hashes. Set max-age to 1 year for versioned assets with the immutable directive. Use no-cache for HTML pages to ensure freshness while benefiting from conditional revalidation. Use ETags for validation. Avoid no-store unless the content contains sensitive data (bank transactions). Preload cacheable resources in the <head>.

## Note

Browser storage is limited per origin (typically 10-50 MB for disk cache). Safari and Chrome have different eviction policies. Service Workers can augment browser caching with programmatic control via the Cache Storage API.

## In code

# Versioned CSS/JS: cache forever
Cache-Control: public, max-age=31536000, immutable

# HTML: always revalidate but can use ETag
Cache-Control: public, no-cache
ETag: "abc123"

## Common questions

Q: Is browser cache cleared when the user clears history?

A: Yes. Browser cache is typically cleared alongside browsing data. Service Worker caches are sometimes preserved separately.

## Key takeaways

## Related entries


Last updated July 2026. Permalink: atomicglue.co/glossary/browser-caching

Schedule a call

30 min · Video call

1
Date
2
Time
3
Details