Hot Reload? HMR?

"Hot Reload" 또는 "Hot Reloading"은 애플리케이션 개발 시에 변경 사항을 즉시 반영하면서 애플리케이션의 현재 상태를 유지하는 기능을 의미한다. 이 기능은 주로 웹과 모바일 애플리케이션 개발 도구에 통합되어 있으며, 개발자의 생산성을 크게 향상시키는 도구 중 하나이다.

React나 Vue같은 라이브러리(프레임워크)들은 "Hot Module Replacement" (HMR)라는 기능을 통해 Hot Reload를 지원하고 개발자가 코드를 수정하자마자 변경 사항을 반영할 수 있게 한다.

Hot Reload의 주요 특징 :

• 즉시 반영: 소스 코드에 변경이 발생하면, 전체 애플리케이션을 다시 시작하거나 새로고침 없이 해당 변경 사항만을 즉시 반영.
• 상태 유지: 애플리케이션의 현재 상태, 예를 들면 사용자가 입력한 데이터나 애플리케이션의 내부 상태 등을 그대로 유지하면서 코드의 변경만을 반영합니다. 이로 인해 개발 중인 기능을 테스트하기가 더 쉽고 빠르게 할 수 있게 한다.
• 생산성 향상: 전체 애플리케이션을 다시 시작하거나 새로고침하는 과정 없이 변경 사항을 빠르게 확인할 수 있다. 즉, 개발 속도가 크게 향상된다.
• 특정 플랫폼/프레임워크에 종속적: 주로 모바일 앱 개발 환경, 예를 들어 Flutter에서 볼 수 있는 기능이다.

Hot Module Replacement (HMR)의 주요 특징:

• 모듈 단위 교체: HMR은 변경된 개별 모듈만 애플리케이션에 즉시 교체하고, 이로 인해 전체 페이지의 새로고침이나 애플리케이션 재시작 없이 변경사항을 반영할 수 있다.
• 상태 유지: 대부분의 경우, HMR은 현재 애플리케이션의 상태를 유지하면서 변경된 모듈만 업데이트한다.
• 웹팩과 통합: HMR은 웹팩과 같은 모듈 번들러에 주로 통합되어 제공된다.
• 프레임워크와 라이브러리 호환성: React, Vue와 같은 프레임워크와 라이브러리는 HMR을 지원하기 위해 특별한 확장 및 플러그인을 제공한다.
• 개발 서버 필요: 대부분의 경우, HMR을 지원하는 개발 서버가 필요하며, 이 서버는 웹팩 dev server와 같은 도구로 제공된다.

두 기술 모두 코드 변경사항을 실시간으로 반영하는 것을 목표로 하지만, 적용되는 환경과 동작 방식에 있어 차이점이 있다.