MVVM과 MVI에 대해서
MVVM
MVVM (Model-View-ViewModel) 아키텍처는 소프트웨어 개발에서 사용되는 아키텍처 패턴 중 하나다.
MVVM은 사용자 인터페이스(UI)와 비즈니스 로직 간의 분리를 목표로 하며, 데이터 바인딩과 명령(Command) 패턴을 중심으로 구성 된다.
🍉 MVVM 아키텍처의 세 가지 구성요소
- Model
애플리케이션의 비즈니스 로직과 데이터를 담당한다. 데이터는 일반적으로 데이터베이스, 네트워크 요청, 로컬 파일 등에서 가져온 정보를 포함하고 있다. - View
사용자 인터페이스(UI)를 표시하고 사용자의 입력을 처리한다. View는 데이터 바인딩을 통해 ViewModel과 상호작용하며, ViewModel에 의해 제공되는 데이터를 화면에 표시한다. 예를 들어, 액티비티, 프래그먼트, 커스텀 뷰 등이 View로 표현될 수 있다. - ViewModel
View와 Model 사이에서 중개자 역할을 수행한다. ViewModel은 View에 표시할 데이터를 가지고 있으며, View에서 발생하는 사용자 입력을 처리하고 Model과 상호작용한다. 또한, ViewModel은 View와의 데이터 바인딩을 통해 상태 변화를 View에 전달한다.
🌽 MVVM 아키텍처의 흐름
- View는 사용자 입력을 감지하고 ViewModel에 전달한다.
- ViewModel은 받은 입력을 처리하고 필요한 경우 Model과 상호작용하여 데이터를 가져온다.
- ViewModel은 데이터를 가공하거나 변형한 후 View에 전달한다.
- View는 ViewModel로부터 받은 데이터를 사용하여 UI를 업데이트한다.
- 사용자의 다른 입력이 있을 경우 위의 단계가 반복된다.
☕️MVVM 아키텍처를 설명하기 위한 간단한 예시
예를 들어, 간단한 할 일 목록 애플리케이션을 개발한다고 가정해보자.
- Model: 할 일 목록의 데이터와 관련된 비즈니스 로직을 처리하는 클래스로, 데이터는 데이터베이스에서 가져오거나 네트워크 요청을 통해 동기화될 수 있다.
- View: 할 일 목록 화면을 표시하고 사용자 입력을 처리하는 액티비티다. 화면에는 할 일 목록이 표시되고, 사용자는 할 일을 추가하거나 수정, 삭제할 수 있다. View는 ViewModel과 데이터 바인딩을 통해 상태 변화를 감지하고 화면을 업데이트한다.
- ViewModel: View와 Model 사이에서 데이터 흐름을 관리하는 클래스로, ViewModel은 View에 표시할 데이터를 가지고 있으며, 사용자 입력을 처리하여 Model과 상호작용한다. 예를 들어, 사용자가 할 일을 추가하려고 할 때, View는 사용자 입력을 ViewModel에 전달하고, ViewModel은 Model을 통해 데이터를 업데이트한 후 View에 변경된 데이터를 전달한다.
MVVM 아키텍처는 UI와 비즈니스 로직 간의 분리를 통해 코드의 유지 보수성을 향상시키고, 테스트 용이성을 제공한다. 또한, 데이터 바인딩을 통해 View와 ViewModel 간의 강력한 연결을 제공하여 개발자의 생산성을 높일 수 있다.
MVI
MVI (Model-View-Intent) 아키텍처는 안드로이드 애플리케이션 개발을 위한 아키텍처 패턴 중 하나이다. 이 아키텍처는 상태 관리, UI 업데이트, 사용자 입력 처리 등을 간결하고 확장 가능하게 구조화하는 데 중점을 둔다.
🍉 MVI 아키텍처의 세 가지 구성요소
- Model
애플리케이션의 상태 및 비즈니스 로직을 담당한다. 상태는 불변 객체로 표현되며, 액션을 통해 업데이트 된다.
예를 들어, 상태는 데이터 모델, 네트워크 요청 결과, 에러 상태 등을 포함할 수 있다. - View
사용자에게 UI를 보여주고 사용자 입력을 처리 한다. View는 상태의 변화를 감지하고 화면에 반영한다. 일반적으로 View는 액티비티, 프래그먼트, 커스텀 뷰 등으로 표현 된다. - Intent
사용자의 의도(사용자 액션)를 나타 낸다. 사용자 입력은 Intent로 변환되어 Model에 전달되고, Intent는 상태를 변경시키는 액션으로 해석되며, Model에 의해 처리된다.
예를 들어, 버튼 클릭, 텍스트 입력 등의 사용자 입력은 Intent로 표현될 수 있 다.
🌽 MVI 아키텍처의 흐름
- View는 사용자 입력을 감지하고 Intent로 변환하여 Model에 전달 한다.
- Model은 받은 Intent를 처리하고 상태를 업데이트 한다.
- 상태의 업데이트는 View에 의해 감지되고 화면에 반영된다.
- 사용자의 다른 입력이 있을 경우 위의 단계가 반복 된다.
☕️MVI 아키텍처를 설명하기 위한 간단한 예시
예를 들어, 할 일 목록 애플리케이션을 개발한다고 가정해보자.
- Model: 할 일 목록의 상태와 비즈니스 로직을 처리하는 클래스이다. 할 일 목록은 리스트로 표현되며, 추가, 수정, 삭제 등의 액션에 따라 상태가 업데이트된다.
- View: 할 일 목록 화면을 표시하고 사용자 입력을 처리하는 액티비티이다. 화면에는 할 일 목록이 보여지고, 사용자는 할 일을 추가하거나 수정, 삭제할 수 있다.
- Intent: 사용자 입력을 나타내는 액션이다. 예를 들어, "할 일 추가", "할 일 수정", "할 일 삭제" 등의 Intent가 있을 수 있다.
사용자가 할 일을 추가하려고 할 때, View는 사용자 입력을 감지하고 "할 일 추가" Intent로 변환하여 Model에 전달한다. Model은 해당 Intent를 처리하여 할 일 목록 상태를 업데이트하고, 변경된 상태는 다시 View에 의해 감지되어 화면에 반영된다. 동일한 방식으로 사용자의 다른 액션도 처리된다.
MVI 아키텍처는 상태 관리와 UI 업데이트를 분리하여 응용 프로그램의 유지 보수성을 향상시키고, 테스트 가능한 코드를 작성하기 쉽게 만든다.
🐬 MVVM과 MVI의 장단점 정리
MVVM의 장점
- 단순성
MVVM은 데이터 바인딩을 사용하여 UI와 상태를 간결하게 연결한다. 이로 인해 코드가 간단하고 가독성이 높아진다. - 테스트 용이성
ViewModel은 비즈니스 로직과 UI 상태를 분리하므로 ViewModel 단위 테스트가 용이 하다. - 확장성
MVVM은 View와 ViewModel 사이의 느슨한 결합을 제공하므로, 새로운 기능을 추가하거나 UI를 변경해도 다른 부분에 영향을 덜 줄 수 있다. - 개발자 생산성
데이터 바인딩을 통해 반복적인 UI 업데이트 코드 작성을 줄여주고, 코드 재사용성을 높여준다.
MVVM의 단점
- 학습 곡선
MVVM은 초기 설정 및 학습 곡선이 있을 수 있다. 특히 데이터 바인딩이 새로운 개념일 수 있으며, 러닝 커브가 있을 수 있다. - 라이브러리 종속성
MVVM은 대부분 데이터 바인딩 라이브러리에 의존한다. 이는 추가적인 학습 및 종속성 관리를 필요로 할 수 있다.
MVI의 장점
- 단일 소스의 상태
MVI는 상태를 중심으로 동작하며, 단일 소스에서 상태 변화를 추적할 수 있다. 이로 인해 상태 관리가 명확하고 예측 가능하다. - 테스트 용이성
MVI는 비즈니스 로직을 순수 함수로 표현하므로 단위 테스트가 쉽다. 액션과 상태의 변화를 테스트하기 용이하다. - 디버깅 및 유지 보수
액션과 상태의 흐름이 명확하게 정의되어 있으므로 버그 추적과 유지 보수가 용이하다. - 시간 여행 디버깅
MVI에서는 이벤트의 흐름을 시간에 따라 디버깅할 수 있는 시간 여행 디버깅(Time Travel Debugging)을 지원하는 도구를 사용할 수 있다.
MVI의 단점
- 복잡성
MVI는 액션, 상태, 의도 등의 추가적인 개념을 도입하기 때문에 초기 구축 및 학습 곡선이 있을 수 있다. - 반복적인 코드
MVI는 상태 변화를 추적하기 위해 많은 중간 객체를 사용한다. 이로 인해 일부 반복적인 코드 작성이 필요할 수 있다. - 성능 오버헤드
MVI는 상태 관리를 엄격하게 제어하기 때문에 약간의 성능 오버헤드가 발생할 수 있다. 특히 큰 규모의 애플리케이션에서는 이를 고려해야 할 수 있다.
MVVM과 MVI는 프로젝트 요구사항과 개발자 선호도에 따라 선택되어야 한다. MVVM은 간단하고 빠른 개발을 지향하는 경우에 적합하며, MVI는 상태 관리와 테스트 용이성에 중점을 둔 복잡한 애플리케이션에 적합하다.