What is Hot Module Replacement?

0-2 years experience

1. 1You're adding a new React component to a project that uses Webpack with HMR enabled. How would you verify that changes to this component are hot‑reloaded without a full page refresh?
2. 2If you modify a CSS module while HMR is running and the styles don't update, what steps would you take to troubleshoot the issue?

2-5 years experience

1. 1During development you notice that after updating a module, the application crashes and HMR falls back to a full reload. Walk me through how you'd diagnose why HMR failed.
2. 2You need to add a third‑party library that doesn't support HMR out of the box. How would you configure Webpack to make it work, and what trade‑offs would you consider?

5-8 years experience

1. 1Our large monorepo uses Webpack with HMR across multiple micro‑frontends. What architectural concerns arise with state synchronization and module boundaries, and how would you mitigate them?
2. 2Explain how you would instrument performance monitoring to ensure HMR updates stay under a latency threshold, and what fallback strategies you'd implement if they exceed it.

8+ years experience

1. 1We are planning to migrate a legacy codebase that currently relies on full page reloads to a HMR‑enabled development pipeline. What cross‑team processes, tooling changes, and long‑term maintenance considerations would you address?
2. 2Discuss the implications of enabling HMR in production builds for a SaaS platform, including security, bundle size, and CI/CD impacts, and decide whether to adopt it.