Error Encyclopedia

@defer behavior when HMR is enabled

Hot Module Replacement (HMR) is a technique used by development servers to avoid reloading the entire page when only part of an application is changed.

When the HMR is enabled in Angular, all @defer block dependencies are loaded eagerly, instead of waiting for configured trigger conditions (both for client-only and incremental hydration triggers). This is needed for the HMR to function properly, replacing components in an application at runtime without the need to reload the entire page. Note: the actual rendering of defer blocks respects trigger conditions in the HMR mode.

If you want to test @defer block behavior in development mode and ensure that the necessary dependencies are loaded when a triggering condition is met, you can disable the HMR mode as described in this document.