UI bundle caching for SDL applications

Copy link to this section

What is Bundle Caching?

Bundle caching is an optimization implemented in our UI infrastructure that allows previously generated UI bundle files to be reused when their source code has not changed.

Although most bundling libraries support caching and already provide change detection, the distributed nature of UiBundler makes it difficult to reuse caches across cluster nodes. Additionally, when a tag is provisioned, the source of truth for all metadata is the deployed artifact and generated files might get lost when they are not part of it.

Bundle caching relies on the module federation feature that is used to generate UI assets for our framework and provides the following features:

• Caching and restoring previously built UI assets - When UI files don't change, UiBundler doesn't have to run again and we simply restore the assets that were generated in the last run.
• Incremental generation of UI assets - Only federated modules whose corresponding source code files have changes will be regenerated
• Static file support - When the generated files are present in the deployed artifact, they will be taken into account as if they were the "files generated in the last run"; if changes are detected, incremental generation will be applied.

Copy link to this section

Suggested configurations

It is important to know that there's no single configuration set that is optimal for all use cases, but we can provide some good recommendations for common setups.

Copy link to this section

Local development environment

When working in a local development environment, all resources are dedicated to the tags you deploy. Since you have total control over this environment, increasing the maxConcurrencyPerNode can be done without considerable risk.

The ideal configs depend on your computer's resources, but for a laptop with 32gb and with only one master node running, these configurations should provide good performance:

// Increase as needed; 4-8 is a good range
UiBundlerConfig.inst().setConfigValue('maxConcurrencyPerNode', 4);
UiSdlConfig.setConfigValue('infrastructure.liveMetadata', true);
UiSdlConfig.setConfigValue('infrastructure.webpackMode', 'development');

Copy link to this section

Production environment

In a production environment, you should aim for stability. The maxConcurrencyPerNode could be increased if you know there are very few tags and/or if they are deployed infrequently.

/*
 * Already the default. Increase as needed depending on how many tags are
 * deployed at the same time
 */
UiBundlerConfig.inst().setConfigValue('maxConcurrencyPerNode', 1);
// Already the default
UiSdlConfig.setConfigValue('infrastructure.liveMetadata', false);
UiSdlConfig.setConfigValue('infrastructure.webpackMode', 'production');

Copy link to this section

Remote development environment

// Increase as needed depending on how many tags are deployed at the same time
UiBundlerConfig.inst().setConfigValue('maxConcurrencyPerNode', 1)
UiSdlConfig.setConfigValue('infrastructure.liveMetadata', true)
UiSdlConfig.setConfigValue('infrastructure.webpackMode', 'development')