What is HMR?

HMR (Hot Module Replacement) is a Webpack mechanism that lets you update individual application modules without a full page reload. Changes are applied "on the fly", right after the file is saved, and the browser replaces only the changed piece of code.

What HMR gives you:

1. Instant visual feedback - the interface updates without reloading.
2. Preserving application state - for example, an open tab, entered text, or component state is not reset.
3. Faster development - the build happens faster and does not distract from the process.

How it works under the hood: the Webpack Dev Server tracks changes in files, rebuilds only the changed module, and sends it to the browser over a WebSocket connection. The browser replaces the updated module right inside the running application.