本次主題會介紹MVC的開發，並提及MVVM架構的設計及其解決的問題，最後會再切入MVVMC，進一步了解它想解決哪一些問題。基於產品的維護性、可讀性、可測試性等來分析架構的理念及重要性，再來就是一些實戰經驗分享。個人認為重要的不是學習這些架構而是它們解決的問題和理念，從中了解並思考為什麼要這樣設計

1. MVC⇢MVVM⇢MVVMC
開發經驗分享
iPlayground 2019
@nghuiqin

2. ⾃肥時間
• NG（⾺來⻄亞⼈）
• Develop from iOS 6, 7
• 在台灣⼯作快滿5年

3. 前⾔
我沒有要說MVC的壞話
MVC其實是很多巨頭APP的根基

4. 簡介
• MVC介紹 → 常犯的問題 → 如何避免和維護
• MVVM解決什麼 → 實戰⼼得 → 優化
• MVVMC再進化 → 實戰⼼得 → 要注意的坑

5. Model
View
Controller
MVC

6. MVC常遇到的問題

7. Controller 背負的責任
Fetch models
Views layout
Business Logic
Routing Logic
Selectors
(Handle actions)
Miscellaneous
(Location, Map, Event…)
Delegates

10. 如何
減輕Controller的負擔

11. 有些職責Model該做
Fat Model Skinny Controller

12. 模組化設計
→ reusability

13. Utilities
APIManager
IAPHelper
LocationManager
AccountManager
Reachability
iCloudManager
Singletons

15. Extension (Category)

16. 程式的品質
Code Quality
UNIT TEST

17. View
Controller
View
Business Logic
Account State
MVC 寫測試遇到瓶頸
Controller 會帶⼀些我們
不需要的Code
Business Logic 有可能被
其他View/Object影響
…

18. Model
View
Controller
MVC MVVM
Model
ViewModel
View
(Controller)

19. Controller 背負的責任
Fetch models
Views layout
Business Logic
Routing Logic
Selectors
(Handle actions)
Miscellaneous
(Location, Map, Event…)
Delegates

20. MVVM - Controller ⼯作量
initViewModel
Views layout
Routing Logic
Selectors
(Handle actions)
Delegates

21. MVVM
Model
ViewModel
View
(Controller)
我很單純

22. ViewModel
Binding to
View
→
→
→
→

23. Unit Test
Controller
Business Logic
Account State
ViewModel
View
…
就有理由不⽤寫
Controller的單元測試

25. MVVM 實戰經驗談
我遇過的問題

26. 是不是所有View都需要
ViewModel？
不需要
簡單的畫⾯可以省略

27. 畫⾯複雜ViewModel好肥
StreamRoomViewModel 不負責任的假設
如果你的畫⾯跟17 App⼀樣很炫炮
MessageBox
ViewModel
GiftPanel
ViewModel
RankingViewModel
AnimationViewModel
沒有⼈⽣來就可以寫完美的code，
持續 refactor 吧 GO！

28. 設計上比MVC花更多時間
某種程度上強迫你去理解完整的商業邏輯
先別動⼿寫Code，先思考。
畫好你的框架再填入內容

29. ViewModel 處理的資料/狀態
變多的時候...
我還是讀得朦傻傻

30. ViewModel 優化
更好讀、測試更好寫
順便釐清責任

31. Inputs/Outputs Protocol
始於Kickstarter在Java&Swift設計的⼀個VM structure
https://github.com/kickstarter/native-docs/blob/master/vm-structure.md

33. 實作ViewModel
⽤Input約束其他物件的控制
⽤Output約束出⼝，只做readOnly

34. Binding的時候也好讀

35. 寫Unit Test的時候也簡單

36. Model
View
Controller
MVC MVVM
Model
ViewModel
View
(Controller)
MVVMC
Model
ViewModel
View
(Controller)
Coordinator

37. MVVMC 變形有很多種
我個⼈使⽤的是Green⼤⼤寫的Coordinator (比較單純，沒太多元素)
https://github.com/nghuiqin/Todo-RxSwift-MVVMC/tree/master/Library

38. MVVM - Controller 責任
initViewModel
Views layout
Routing Logic
Selectors
(Handle actions)
Delegates

39. Controller 責任-1
initViewModel
Views layout
Selectors
(Handle actions)
Delegates
Routing logic
Coordinator
initVC

41. Controller
增加可重複使⽤性

42. Controller 責任-1
initViewModel
Views layout
Selectors
(Handle actions)
Delegates
Routing logic
Coordinator
initVC
視情況⽽定

43. App
Coordinator
Login
Coordinator
MainTab
Coordinator
Register
Coordinator
Home
Coordinator
Setting
Coordinator
Detail
Coordinator

44. Dependency Injection
消滅Singleton的存在

45. Singleton 的隱患
關聯性問題 Coupling Issue
→ 到底是誰改了它的值？
→ 想像⼀下Global Variable的可怕，海底撈針
→ 寫測試的時候，它的狀態要怎麼控制？（難）

46. 定義App Dependency
靠Coordinator指派下去

47. 在ViewModel/View裡
設計Dependency的取⽤

48. DI + Protocol 簡化
單元測試

49. 現在我可以⾃由決定這個ViewModel的狀態
⽬標就是測試ViewModel + Dependency邏輯正確

50. 建議DateFormatter也可以當
Utilities Dependency

51. 蘋果在這裏告訴你DateFormatter很貴
https://developer.apple.com/library/archive/documentation/Cocoa/
Conceptual/DataFormatting/Articles/dfDateFormatting10_4.html

52. 寫MVVMC可能
會遇到的坑

53. 不建議使⽤xib/Storyboard
為了讓Dependency inject起來漂亮

54. Coordinator 注意回收的問題
依你使⽤的Coordinator的設計⽽定
我的情況是在原⽣回到上⼀⾴時下需要特別處理
另外就是可能被ViewController/ViewModel retain

55. AppDependency傳入的⽅法
由於Coordinator是有層層關係
App → B → C → D
如果只有D需要dependency的東⻄
B、C的Coordinator也會需要帶

56. MVVMC學習成本頗⾼
真諦是理解為什麼要這樣設計
好像離⼤神更進⼀⼩步了
以後⾯試拿出來說嘴 (X

57. • 選擇適合你團隊的架構
• 沒接觸過MVVM的話，可先從MVVM開始
• 有必要跟風MVVMC嗎？ 看團隊意願
• 個⼈建議全新專案 + 團隊認可這個⽅案
• ⼀⼈團隊沒有太多時間QAQ： MVC其實也不賴啦
結語

58. “Keep it simple, stupid.”
先從簡單的開始

59. References
Follow Green
• Github: @Greenchiu , Twitter: @handkid
Kickstarter Inputs/Outputs Protocol
• https://github.com/kickstarter/native-docs/blob/master/
vm-structure.md
想要了解更多MVVMC實作，可以參考我的練習
• https://github.com/nghuiqin/Todo-RxSwift-MVVMC/