eightshift-forms icon indicating copy to clipboard operation
eightshift-forms copied to clipboard

[FEATURE] - Cache busting in webpack build output filenames

Open mbmjertan opened this issue 5 months ago • 1 comments

I think we should add support for cache busting Eightshift Forms assets. Given they're used as prebuilt on any project using Forms, this should be done in the Forms webpack config. I can open a PR for this, but I'm opening an issue first for visibility and discussion.

We propose something along these lines:

		output: {
			...project.output,
			filename: (pathData) =>
				arrayOfExcludedFiles.includes(pathData.runtime)
					? '[name].js?t=' + new Date().getTime()
					: '[name]-[contenthash].js?t=' + new Date().getTime(),
			chunkFilename: '[name]-[contenthash].js?t=' + new Date().getTime(),
		},

Alternatively, Forms users could use the script_loader_tag hook to filter the links to Forms assets and add a cache busting parameter, but this does not affect Webpack chunk imports, only the top-level import and can still lead to broken assets on the frontend. The only actual alternative I see is rewriting all files with a proxy service (nginx, Cloudflare Workers etc.), but this is expensive and complicated.

I would prefer if we could just add a content hash and/or a GET param with build-sensitive data to all webpack-built files and chunks. If there are concerns with this, let's discuss them.

mbmjertan avatar Sep 06 '24 11:09 mbmjertan