MVC와 MVVM 모델 비교

 

1. 비유

MVC (Model-View-Controller) : 레스토랑의 웨이터

• 컨트롤러(Controller)는 레스토랑에서 손님과 주방을 연결하는 웨이터입니다.
• 손님(사용자)이 메뉴를 주문하면, 웨이터는 주방(모델)으로 가서 요리를 요청하고, 완성된 요리를 가져와 손님에게 전달(뷰) 합니다.
• 웨이터는 모든 요청을 처리하기 때문에 매우 바쁘고, 고객이 많아지거나 메뉴가 복잡해지면 혼란스러워지고 실수할 가능성이 높아집니다.

---

MVVM (Model-View-ViewModel) : 키오스크 시스템

• 뷰모델(ViewModel)은 레스토랑에서 스마트 키오스크 역할을 합니다.
• 손님은 키오스크 화면(뷰)에서 원하는 메뉴를 선택하면, 키오스크가 자동으로 데이터를 주방(모델)으로 전달하고, 주방에서 요리가 준비되면 키오스크 화면이 자동으로 업데이트되어 손님이 알 수 있습니다.
• 스마트 키오스크는 주방과 화면을 자동으로 연결하므로, 웨이터처럼 바쁘게 움직일 필요가 없습니다.
• 메뉴가 변경되거나 손님이 수정을 요청하면, 키오스크가 자동으로 주방과 연결되어 작업이 원활하게 이루어집니다.

2. 주요 차이점

	MVC	MVVM
구성요소 연결 방식	컨트롤러가 모든 연결을 직접 처리	뷰모델이 데이터 바인딩을 통해 자동 연결
데이터 흐름	데이터가 변경되면 컨트롤러가 수동으로 뷰에 반영	데이터 바인딩으로 모델 변경 시 뷰가 자동 업데이트됨
사용자 입력 처리	컨트롤러가 직접 입력을 처리하고 이를 모델에 반영	뷰모델이 사용자 입력을 받아 모델에 전달
유지보수성	프로젝트 규모가 커지면 컨트롤러가 비대해지고 복잡해짐	데이터 흐름이 깔끔하고 구조적이며 유지보수가 용이
양방향 데이터 바인딩	지원하지 않음	지원 (모델과 뷰 간의 데이터가 자동으로 동기화됨)

---

3. 예시

MVC 예시: 날씨 앱

• 사용자가 "오늘의 날씨는?"을 묻습니다.
• 컨트롤러는 모델에 데이터를 요청하여 오늘의 날씨 데이터를 가져옵니다.
• 컨트롤러는 데이터를 다시 뷰로 전달하여 화면에 표시합니다.
• 만약 내일 날씨가 바뀌면, 컨트롤러가 다시 모델로 가서 새로운 데이터를 가져와 뷰를 업데이트해야 합니다.

MVVM 예시: 날씨 앱

• 사용자가 "오늘의 날씨는?"을 묻습니다.
• **뷰모델(ViewModel)**은 모델에서 데이터를 가져와 뷰와 자동으로 동기화합니다.
• 모델에서 날씨 데이터가 바뀌면, 뷰모델이 자동으로 뷰를 업데이트하므로 수동 작업이 필요 없습니다.

---

4. MVC와 MVVM의 장단점

MVC 장점:

• 간단한 애플리케이션 개발에 적합.
• 구성 요소가 명확히 나누어져 있어 시작하기 쉬움.
• 데이터 흐름이 단방향으로 직관적.

MVC 단점:

• 컨트롤러가 점점 복잡해지고, 코드 중복 발생 가능.
• 뷰와 모델 사이의 연결을 수동으로 처리해야 함.
• 양방향 데이터 바인딩이 없어서 데이터 변경 시 추가 작업이 필요.

---

MVVM 장점:

• 데이터 바인딩을 통해 모델과 뷰의 자동 동기화 지원.
• 데이터 흐름이 깔끔하고, 코드 유지보수가 쉬움.
• 비즈니스 로직과 UI 로직이 분리되어 테스트 용이.

MVVM 단점:

• 데이터 바인딩을 지원하는 추가 라이브러리나 프레임워크가 필요.
• 간단한 프로젝트에서는 설정이 다소 복잡할 수 있음.
• 데이터 바인딩의 과도한 사용은 디버깅을 어렵게 만들 수 있음.

---

5. 요약

• MVC는 단방향 흐름으로, 컨트롤러가 모든 것을 직접 처리하며 단순한 구조에 적합.
• MVVM은 양방향 데이터 바인딩으로, 뷰모델이 모델과 뷰를 자동으로 동기화하며 대규모 애플리케이션에 적합.
• 선택 기준:
  • 작은 프로젝트 → MVC.
  • 데이터 흐름이 복잡하거나 UI 업데이트가 빈번한 대규모 프로젝트 → MVVM.