Upgrade to Pro — share decks privately, control downloads, hide ads and more …

cache rules everything

Harry Roberts
September 23, 2023

cache rules everything

Caching is something most developers take for granted, but experience tells me time and time again that most developers also don’t understand how to configure their caching rules safely, correctly, or effectively. Do you know what no-cache means? Do you know what the Pragma header does? Do you know the difference between Last-Modified or ETag? Expires or Cache-Control? You will soon.

In this talk, we’ll remove the noise, get rid of everything we don’t need, and then step through a series of real-life scenarios to work out how to solve almost any caching situation with a series of questions.

Harry Roberts

September 23, 2023

More Decks by Harry Roberts

Other Decks in Technology


  1. revalidation: how do i check that a file has changed

    after my cache time limit is up?
  2. revalidation: how do i check that a file has changed

    after my cache time limit is up?
  3. pragma a caching header… sort of never meant to be

    used as a response header at all! should not be used
  4. “pragma is not specified for http responses and is therefore

    not a reliable replacement for the general http/1.1 cache-control header.” — csswz.it/45ZBCV7
  5. expires a caching header not really harmful, just cache-control is

    better cache-control has been preferred since january 1997 expire at an absolute time fails if a user has changed their system time can quickly turns fi les completely uncacheable
  6. “if there is a cache-control header with the max-age or

    s-maxage directive in the response, the expires header is ignored.” — csswz.it/3EMHipn
  7. last-modified a revalidation header not really harmful, just etag is

    better date-of-creation is a proxy for change-of-content
  8. cache-control a caching header the rules and conditions for caching

    a response superseded expires in 1997 extensible
  9. etag a revalidation header weak or strong etags a hash

    of the cached response to compare to the remote version slightly more reliable than last-modified
  10. max-age how long for, in seconds? relative, whereas expires is

    absolute relative to the moment it entered cache give very careful consideration to these values everything in this slide-deck is an example—do not just copy/paste
  11. no-cache forbids the browser from going straight to the cache

    always makes a trip to the server always incurs a round-trip of latency negligible performance bene fi t unless the fi le was quite large
  12. public do you want many people to have access to

    the same fi le? e.g. all users need the same style.css exposes cacheability to cdns implied by the presence of max-age, so actually redundant comes with side-e ff ects, so usually best avoided
  13. private only the requesting client may store the response prevents

    personalised responses being sent to other visitors not a replacement for or alternative to no-store
  14. yes no cache-control: max-age=3600 cache-control: max-age=3600, 
 must-revalidate can we

    reuse this response for of fl ine users even if it’s stale?
  15. must-revalidate caches are permitted to serve stale content unless explicitly

    told otherwise e.g. when a browser is o ff l ine must-revalidate prohibits this behaviour leave it o ff of anything that might be useful o ffl ine, even if stale e.g. non-live train timetable, blog-post add to things that might lie to people if out of date e.g. live train timetable
  16. “http allows caches to reuse stale responses when they are

    disconnected from the origin server. must-revalidate is a way to prevent this from happening…” — csswz.it/48pKjtf
  17. yes no cache-control: max-age=3600, 
 stale-while-revalidate=600 cache-control: max-age=3600 can we

    tolerate a slightly out- of-date response while we perform revalidation?
  18. stale-while-revalidate revalidation is synchronous; users see nothing until revalidation is

    complete can we get away with showing the old response to fi ll that gap? e.g. decorative image in a blog post
  19. s-maxage why would you con fi gure shared and private

    caches di ff erently? you can’t empty your user’s cache, but you can empty your cdn’s set private cache to one hour and cdn cache to one day can clear cdn cache when you deploy users have maximum one-hour-old responses without having to come all the way back to origin
  20. immutable make a ‘contract’ with the browser fi ngerprinted fi

    les cease to exist when they’re ‘changed’ we get a whole new fi le therefore, we can cache this fi le forever, and never need to revalidate it how long is forever?
  21. prefer etag last-modified changes whenever a fi le is written,

    even if its contents don’t etag only changes if the fi le actually changes avoids false-positives and wasteful 200 responses
  22. harryroberts in ~/cache-rules-everything on (main) » echo 'hello world' >

    revalidation » stat revalidation 
 ... sep 20 18:37:50 2023 » md5 revalidation 
 6f5902ac237024bdd0c176cb93063dc4 » echo 'hello world' > revalidation » stat revalidation 
 ... sep 20 18:39:23 2023 » md5 revalidation 
 6f5902ac237024bdd0c176cb93063dc4 same di ff erent
  23. weeks days hours minutes short medium long forever never /my-account

    /news /store-locator /assets/product.jpg /assets/app.2efc38.ccs
  24. cache-control versioned 
 assets non-versioned 
 assets immutable maximum expiry

 (68 years) more granular 
 directives etag
  25. further reading cache-control for civilians (harry roberts): csswz.it/3rvpFYb caching header

    best practices (simon hearne): csswz.it/45anbMy the headers we don’t want (andrew betts): csswz.it/46sqWOH