JS file HTTP Cache-Control
With the Service Worker now gone (#1698 (closed)), we need to add better HTTP caching for our large JS files.
There are at least two large JS files in our current build:
-
artifacts.json
~3.6MB GZipped - React main bundle ~3.3 MB GZipped
With our current config (maybe this comes from NGINX...?), it looks like all JS files get the response Cache-Control header:
Cache-Control: no-cache, must-revalidate
Which means that they are always downloaded. Possibly the most effective way to solve this is to use the "cache-busting" mechanism, where the JS filenames contain a version hash, and all JS files get the following header:
Cache-Control: max-age=31536000, immutable