Does both HTML and CSS, JS, and images share the same cache headers (max-age=0, must-revalidate, public)?
Reading other posts about caching, I’ve had the impression Netlify set a different cache policy for HTML (a shorter one) than the rest. But inspecting how all they were being loaded, I’ve noticed they all share the same one.
And since Gatsby (at least the starter that I am using) creates a new hash for CSS, JS, and image files when they are modified, would it be ok to set their max-age to a high value?
Hi @thomasryu, I actually recommend disabling the cache busting that’s creating new hashes for all assets. This is slowing down your deployments. By default, netlify will handle caching for you. We also only deploy new or changed files. If you are modifying all files for cache busting then we’ll end up re-uploading files that are otherwise unchanged, which is a waste of time during your build process. Since we control deployments as well as the CDN, we know when files are changed and we invalidate old files when new ones are uploaded automatically. That said, you are free to pass any cache-control headers you want, but be careful in doing so. I’ve seen someone cache a 404 by accident for quite a long time. I’d say that our default cache handling handles things well. If the asset has not changed then we return a 304, so the browser knows to use the one it has cached.
If netlify does this out of the box then why do the default headers contain max-age=0, must-revalidate? This forces browsers to request cached assets again only to receive a 304 from your end @futuregerald
Hey @tommedema,
This article is a few years old at this point but it’s still mostly accurate and covers exactly what you’re asking about Better Living Through Caching Let us know if that helps or if you have other questions!