infinum / eightshift-forms

WordPress plugin project for Gutenberg forms
https://eightshift.com
Other
29 stars 5 forks source link

[FEATURE] - Cache busting in webpack build output filenames #449

Open mbmjertan opened 2 months ago

mbmjertan commented 2 months ago

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.

dingo-d commented 2 months ago

Scripts should have the correct asset version from the looks of it (the enqueue scripts are using the version param).

I think only webpack needs to be modified (like you proposed) so that the version parameter is added to the chuncked parts as well.

It would be great if we could somehow reuse the same version from the plugin here instead of defining the custom ?t param, but if that's a too big of a hassle the above approach works 👍🏼