차이점을 다루는 글에 앞서 UIKit과 SwiftUI는 상호 배타적이지 않다는 점을 미리 말씀드린다. SwiftUI는 현재 완성형이 아니며 세밀한 인터페이스 작업을 위해서는 UIKit을 이용해야 한다. 애플에서도 둘의 간극을 좁히고자 기술적인 지원을 계속하고 있다.
UIKit
UIKit은 명령형이며 이벤트 중심의 프레임워크이다. UIKit에서는 View hierarchy에서 각 View를 참조할 수 있고, View의 로딩 혹은 이벤트 발생(버튼 누르기 혹은 UITableView에 표시 가능해진 새 데이터 등장)에 대한 반응으로 View를 업데이트할 수 있다. 이러한 이벤트들을 핸들링하기 위해서 callbacks, delegates, target-action 등을 사용해왔다.
SwiftUI
SwiftUI는 선언적, 상태(State) 중심의 프레임워크이다. SwiftUI에서는 View hierarchy를 통해 View를 참조할 수 없고, 이벤트에 대한 반응으로 직접 View를 변경할 수 없다. 대신 View에 바인딩 되어 있는 상태(State)를 변화시켜 값을 업데이트 한다.
애플에서 UIKit -> SwiftUI로 전환하는 이유
UIKit에서 주로 사용되는 MVC 패턴은 뷰와 모델이 밀접하게 연결되고, 뷰와 컨트롤러 간에 강한 의존성이 생기는 문제가 있었다. MVC에서 뷰는 수동적인 존재인데, 뷰 컨트롤러의 속성으로 존재하며 생성되고 해제될 때까지 뷰 컨트롤러에 의해 관리되고 수행해야 하는 행동을 전달받는다. 이런 이유로 뷰 컨트롤러가 수행해야 하는 작업의 비중이 너무 커지면서 필연적으로 유지보수 및 협업에 큰 문제가 생기게 되었다.
그래서 MVC 패턴의 문제점을 수정한 MVVM 패턴을 따르는 SwiftUI를 애플이 출시하기에 이른다.(선언형 UI 프레임워크가 대세인것도 이유가 될 것이다).
M(Model) - 앱의 데이터와 비즈니스 로직을 캡슐화한다. 뷰와 독립적이어야 한다.
V(View) - 플랫폼에서 제공하는 시각적 요소들을 사용해 UI를 정의한다.
VM(View Model) - 뷰와 모델 사이의 중개자로서 프레젠테이션 로직을 정의하고, 뷰에 모델의 데이터를 제공하며 모델에는 업데이트를 요청한다.
MVVM의 장단점
장점
- 이미 다른 곳에서 사용 중이거나 변경하기 어려운 기존 모델을 사용해야 할 때, 모델에 대한 수정 없이도 어댑터 역할을 하는 뷰 모델을 통해 뷰에서 활용할 수 있다.
- 개발 프로세스에서 뷰와 앱의 로직에 대해 독립적으로 동시에 작업할 수 있다. 디자이너는 뷰에 집중하고 개발자는 뷰 모델 및 모델에 대해서만 신경 쓸 수 있게 도와준다.
- MVVM을 사용하면 UI 코드를 분리해 순수하게 앱의 기능과 비즈니스 로직에 집중해서 테스트를 진행할 수 있다.
단점
- 명령형과 비교해 데이터 바인딩으로 연결된 선언형 방식의 프로그래밍은 디버깅이 까다롭다.
- 적절하게 일반화된 뷰 모델을 설계하기가 쉽지 않다.
- 모델의 데이터를 뷰 모델에서 다시 작성함에 따라 추가 코드들이 많이 발생한다.
View and Controls
| UIKit | SwiftUI |
|---|---|
| UILabel | Text |
| UITextField | TextField |
| UITextField(inSecureTextEntry 설정) | SecureField |
| UIButton | Button |
| UIImageView | Image |
| UISwitch | Toggle |
| UISlider | Slider |
| UIStepper | Stepper |
| UIPickerView | Picker(WheelPickerStyle) |
| UISegmentedControl | Picker(SegmentedPickerStyle) |
| UIDatePicker | DatePicker |
| UITextView | 동일 요소 없음 |
| UIStackView | HStack(가로 방향), VStack(세로 방향) |
| UIScrollView | ScrollView |
| UITableView(Plain) | List |
| UITableView(Grouped) | List(GroupedListStyle) |
| UICollectionView | 동일 요소 없음 |
ViewControllers
| UIKit | SwiftUI |
|---|---|
| UIViewController | View |
| UINavigationController | NavigationView |
| UITabBarController | TabView |
| UISplitViewController | NavigationView |
| UITableViewController | List |
| UICollectionViewController | 동일 요소 없음 |
| UIAlertController(actionSheet 스타일) | ActionSheet |
| UIAlertController(alert 스타일) | Alert |
Text는 단순하게 UIKit의 UILabel과 같은 역할이라고 이해할 수도 있겠지만, SwiftUI에서는 버튼(Button), 피커(Picker), 토글(Toggle) 등 다양한 뷰에서 그 UI를 구성할 때 Text를 사용해야 하는 경우가 많아, UILabel보다 훨씬 사용 범위가 넓고 그 빈도도 높다.
