MVC, MVP, MVVM 패턴

MVC같은 경우는 뭐 워낙 익숙해서 글 읽으니 바로 이해했다. 근데 MVP는 낯설다.

 

정의 : MVP패턴은 MVC 패턴으로부터 파생되었으며 MVC에서 C에 해당하는 컨트롤러가 프레젠터(presenter)로 교체된

          패턴이다. 뷰와 프레젠터는 일대일 관계이기 때문에 MVC 패턴보다 더 강한 결합을 지닌 디자인 패턴이라고

         할 수 있다.

          → 그래서 presenter가 Controller랑 다른 역할이 뭔지에 대해 이해하는데 의외로 오래 걸렸다...

 

우선 기본적인 MVC패턴의 그림을 보자.

MVP패턴

 

- 예를 JSP파일로 든다. Model에서 비즈니스 로직을 처리한 후에 Controller에 넘기고 Controller에서 가공한다고

  해도 Model에 있는 컬럼 값을 기본으로 한다. 비록 Controller를 통해서 왔다고 하지만 Model을 참고해야 한다는

  것이다. 이는 View와 Model이 가시적으로 분리되어있다고 해도 결국 Model을 참고해야 한다.

  즉 View와 Model의 의존성이 생긴 것이다. 이는 개발하는 입장에서 상당히 번거로운 일이 되는 것이다.

 

MVP패턴(Model View Presenter)

정의 : MVC패턴으로부터 파생되었으면 MVC에서 C에 해당하는 컨트롤러가 프레젠터(presenter)로 교체된

          것이다. 

MVP패턴

 - MVP패턴의 경우 View가 Presenter에게 요청하게 되면 Model에서 비즈니스 로직을 처리한 후에 Presenter에게

   데이터를 받게 된다. Presenter에서 처리된 가공 데이터를 가지고 View단에서 그대로 쓰면 되는데 이는 Model

   을 생각하지 않고 진행되므로 View와 모델의 의존성이 줄어든 것을 알 수 있다.

 

MVVM(Model - View - ViewModel)패턴

정의 : C에 해당하는 컨트롤러가 뷰 모델(view model)로 바뀐 패턴이다.

          뷰모델은 뷰를 더 추상화한 계층이다. 뷰와 뷰모델 사이의 양방향 데이터 바인딩을 지원하며 UI를 별도의 코드 수정

          없이 재사용할 수 있고 단위 테스팅하기 쉽다는 장점이 있다.

MVVM 모델

 

 - View에서 사용자에게 요청이 들어오면 Controller대신 ViewModel이 Model의 비즈니스 로직을 처리한다.

   그 후 View가 ViewModel의 가공된 데이터를 데이터 바인딩을 하게 된다.

 

※ 꼬꼬무

데이터 바인딩(Data Binding)이란 ? :View와 Model을 묶어서 서로 간의 데이터를 동기화하는 것이다.

 

단방향 바인딩(1Way Data Binding) : 단방향 바인딩이란 한 쪽으로만 데이터 바인딩이 된다는 것인데

상위 컴포넌트의 데이터가 변경되면 하위 컴포넌트에 영향이 가는 것이다. 이는 주로 React.js가 기반으로 한다.

 

단방향 바인딩(2Ways Data Binding) : 양방향 바인딩이란 두 방향으로 데이터 바인딩이 된다는 것인데

컴포넌트의 데이터가 변경되면 하위 컴포넌트뿐만 아니라 상위 컴포넌트까지 영향이 가는 것이다. 이는 주로 Vue.js

가 기반으로 한다.

 

MVC, MVP, MVVM 각각의 장단점

1) MVC

장점 

- 분리된 역할 : 비즈니스 로직, 데이터 처리, UI 로직이 각각의 역할에 명확히 나뉘어져 있어 유지보수가 쉽다.

- 재사용성 : 각 부분이 독립적으로 테스트 가능하고 재사용이 가능합니다.

 

단점

- 복잡성 : 프로젝트 규모가 커질수록 컨트롤러가 복잡해질 수 있다.

- 의존성 : 뷰와 모델 사이의 의존성이 높아진다.

 

2) MVP

장점

- 단일 책임 원칙 : 뷰는 UI 로직에 집중하고, 프레젠터는 비즈니스 로직에 집중하여 책임이 명확히 분리된다.

- 테스트 용이성 : 단일 책임 원칙에 의해 컨트롤러에 대한 단위 테스트에 장점이 있다.

- 유연성 : 뷰와 모델의 의존성이 낮아져 유연한 개발이 가능하다.

 

단점

- 추가적인 클래스 : MVC에 비해 추가적인 Presenter 클래스가 필요하므로 초기 구축에 있어서는 비용이

                               증가할 수 있습니다.

 

3) MVVM 패턴

장점

- 바인딩 : 뷰모델(ViewModel)이 데이터와 뷰를 바인딩하여 상태 변화를 자동으로 업데이트할 수 있다.

- 뷰와 모델 간의 느슨한 결합 : 뷰는 뷰모델을 통해 모델에 접근하기 떄문에 느슨한 결합을 유지한다.

 

단점

- 바인딩이 지나치게 많거나 복잡할 경우 성능 문제가 발생할 수 있다.