single-spa / single-spa

The router for easy microfrontends
https://single-spa.js.org/
Other
13.31k stars 915 forks source link

Caching Options and Best Practices #1248

Closed mike-nasser-shift4 closed 1 month ago

mike-nasser-shift4 commented 1 month ago

Describe the bug or question My organization is having issues with cached copies of the files generated for Single SPA. We'd like to generate new versions of each application and app shell bundle file for any staging and production instances of each file whenever changes are made to ensure the browser cache clears. Do you have any documentation or best practices around this?

joeldenning commented 1 month ago

Two options for this:

  1. webpack content hashing
  2. Placing the files for new deployment under a virtual folder on the CDN via CI/CD config (https://cdn.example.com/apps/navbar/GENERATED_HASH/navbar.js)

The examples in the import-map-deployer repo show some ways of handling this in the CI/CD config rather than in the webpack config. A lot of CI tools have environment variables that can be used as the virtual folder name. See $CI_COMMIT_SHORT_SHA in this example for how the virtual folder is created. Sometimes it's with cp and sometimes with gsutils or aws