[suggestion] webpack: add unique hashes to output filenames

[tjosepo]

Currently, our production Webpack configuration uses these options:

output: {
    filename: "[name].js",
    assetModuleFilename: "[name][ext][query]"
}

The names of our entryfile and assets are static across builds. chunkFilename is not set, which means chunks have default filename [id].js which will also remain static most of the time.

These options can cause issues with caching heuristics used by different platforms, notably Cloudflare which adds a 4-hour browser cache directive on all .js files by default (see Cloudflare - Default cache behavior.)

These options forces us to disable caching in all our infrastructure to prevent a user from using a file from their cache when it has been updated on the server.

Ideally, we'd use hashes to ensure users can safely cache our files without the risk of loading a file from cache while a new version exists.

By default, Rollup and Vite use the pattern [name]-[hash][ext] for all outputs. We should probably do the same.

Warning

Module Federation entrypoints need static names, so the remote entrypoint cannot have a hashed filename. Cache can be bypassed in other ways, e.g. using a URL parameter, but that is the responsability of the host module or a framework to do.

[patricklafrance]

Hey @tjosepo!

We used to have unique hashes but we removed them because of the following issue: https://workleap.atlassian.net/browse/WP-146 and Netlify atomic deployments.

Here are additional information on the issue and fix (which is still not optimal to this day):

• https://workleap.atlassian.net/l/cp/8SxPVNm1
• https://workleap.atlassian.net/l/cp/fk16TGEf

If you still believe that this fix is not adequate and you have a better solution to propose, we are open to it. Let us know!