Post on 15-Apr-2017
MV(C,VM) in iOS & ReactiveCocoa
Neo
OutlineMV* Family
Original What & why Components in MVC & MVVM Architecture MVC & MVVM in iOS Something wrong?
ReactiveCocoa Original What & why FRP - Functional Reactive Programming How to use Something right?
Conclusion
MV* FamilyOriginal Trygve Reenskaug(Noway computer scientist)
The original MVC reports [1](I made the first implementation and wrote the original MVC reports…) CAD/CAM
MVC be changed a lot, and extended new patterns(main principle)
MVC - Model-View-Controller MVVM - Model-View-ViewModel MVP - Model-View-Presenter MTV - Model-Template-View
[1]http://heim.ifi.uio.no/~trygver/2007/MVC_Originals.pdf
What are them? Design pattern (Architecture pattern) Diagrams for establish a robust program architecture
Why need them? Data, logical, and UI code are like shit in early code when GUI appearance.
separate concrete of concerns Handle more and more complex program
Understandable manageable maintainable reusable etc…
Components in MVC and MVVM They are same in Model(M) and V(View)
Model (M) - the domain knowledge or data, it can be simple value, object or class. View (V) - everything graphical user can see
C in MVC Controller (C) - A link between model and view, and also an event handler.
VM in MVVM ViewModel (VM) - it’s the same as controller, but contain all jobs which not belong to view/model
What are they different in thinking? Controller think that they can be three independent components ViewModel think that view and controller cannot be separated clearly
Architecture improvement Smalltalk’80 MVC
Microsoft MVVM
ref. from:[2]
ref. from:[2]
Architecture improvement Smalltalk’80 MVC
Microsoft MVVM
ref. from:[2]
ref. from:[2]
ref. from:[3]
Architecture improvement Smalltalk’80 MVC
Microsoft MVVM
ref. from:[2]
ref. from:[2]
ref. from:[3]ref. from:[4]
Architecture improvement Smalltalk’80 MVC
Microsoft MVVM
ref. from:[2]
ref. from:[2]
ref. from:[3]ref. from:[4]
ref. from:[5]
Architecture improvement Smalltalk’80 MVC
Microsoft MVVM
ref. from:[2]
ref. from:[2]
It’s divergent in concepts
ref. from:[3]ref. from:[4]
ref. from:[5]
Design pattern is still improving and evolving
MVC in iOS In iOS, model and view always communicate each other through by controller Model and view never talk to controller directly, but controller do.
ref. from:[2]
MVVM in iOS In iOS, view controller still exist, but same as view’s task ViewModel handler all controller’s logic block, includes business logic, presentation logic, network request, etc…
Why is MVC in iOS? Standard implementation Objective-C references features of smallTalk Official tutorial documents or classes all tell us MVC
(These pictures ref. from:[6][7])
Why Cocoa design pattern did not follow Smarttalk’80 ?
View and model did not loose-couple It’s not reusable Ambiguous about what they concern
Simple to see difference in MVCs and MVVM
MVC View modelview No YES
model YES NO
MVC in iOS View modelview No NO
model NO NO
MVVM View modelview No NO
model NO NO
Three tables about components communication
MVC’s example If i want an very simple App which can input family name and display what I input……
A model - Store family data A view - a App’s GUI for user A controller - Handle event and user’s action
View in MVC View does not provide any method about data, it just provides accessor’s method to interaction with controller.
Model in MVC Model has a class object about data, and some method’s related data. Also, it does not care about View.
Controller in MVC In the controller, we need to implement:
notification, Delegation or other mechanism to update view or model. Event handler(user action or data change)
if interesting, https://github.com/flamelad/MVFamilyPractice
MVVM’s example Family name App again lol
Difference - MVVMViewModel files It responses for anything which is not responded by Model and View
ViewController In MVVM
Where are these functions?
ViewModel In MVVM Those functions all in ViewModel
But, how communicate with ViewController?
ViewModel In MVVM
In *.h file, declare all properties which are needed to show in screen or accepted data input.
ViewController update screen: (KVO, Notification) Monitor these properties for update properties
ViewController input data: (Accessor method) Access the property which is designed for receive data in VewModel
ViewModel
Model ViewController Viewdelegate
Setter
Accessor MethodNotification KVO Notification
KVO
Something wrong? (Let’s thinking what problem may we meet in iOS MVC now…)
Controller god damn fat Some methods are inexplicit (ex: network request about data) KVO and notification mechanism lead to difficult understand it View and controller cannot be really separated clearly Difficult to do unit test Difficult to understand your controllers
ReactiveCocoa is saver..….maybe?
ReactiveCocoa
Original Github for Mac App’s Developers - Josh & Justin ReactiveCocoa developed by them when they develop Github for Mac
What is it It’s a open source framework which implementation base on Functional Reactive Programming (FRP) https://github.com/ReactiveCocoa/ReactiveCocoa Only supports OS X 10.9+ and iOS 8.0+ new version is concentrated on the Swift
Why is it The framework with MVVM tried to solve problems what we meet in MVC
FRP - Functional Reactive Programming
It’s a programming diagram which combine reactive programming and functional programming Function programming (Just very simply describe their difference here)
Imperative programming - write and execute steps by step Ex: for (int i=0;i<arr.count;i++){logical for find MaxNumber}; Functional programming - function, input, output.Ex: int MaxNumber= MaxNumber(1,10);
Reactive programming What is it? Concept is around data flows and propagation of change Let’s easy to know it Ex:
proactive vs. reactive a = 2;b = 3;
c = a+b; a = 3;
Now, c = ?c = 5 c = 6
After combine functional and reactive programming It’s like pipe, you do not need to know how the pipe transfer water It’s like pipe, you put something in, always something out It’s like pipe, something always are not changed during in the pipeIt’s like pipe, water in the pipe is continuous, data flow too. It’s like pipe, pipes can be concatenated to process it centrally It’s like pipe, output can be filter, reduce, and map
What advantages are worth to adapt it? Code clean - KVO, notification, target-action or observer can be centralized Make code more understandable Decrease problem that value be changed at somewhere
Is it no disadvantage? No, it is. 1. it performance is lower than native2. Debug is difficult 3. return value type always id.
How to start ReactiveCocoa(RAC)? Getting started https://github.com/ReactiveCocoa/ReactiveCocoa#getting-started/ Framework overviewhttps://github.com/ReactiveCocoa/ReactiveCocoa/blob/master/Documentation/FrameworkOverview.md There are many component to transfer and process dataSignal, Subjects, Commands, Sequences, Schedulers, mapping, etc…… Familiar it, and then do it
[Simply Demo]
[Demo Page]
Problem thinking again Controller god damn fat Some methods are inexplicit (ex: network request about data) KVO and notification mechanism lead to difficult understand it View and controller cannot be really separated clearly Difficult to do unit test Difficult to understand your controllers
Something right? According to presentation, we known: 1. MVVM can solve Controller is too fat 2. MVVM can solve concerns ambiguous 3. MVVM can solve redefine View and ViewController 4. MVVM can be more easier understand ViewController 5. ReactiveCocoa can let logical be centralize 6. ReactiveCocoa can help MVVM clear code and separate
Conclusion If MVVM is so good, why Apple does not use it?
In fact, although it’s not same all, Apple used some concepts and logical in OSX App implementation- ref. from:[4]
If MVC is so bad, why Apple use it? In fact, although MVC has some disadvantage, but it still a nice design pattern. Of course, the most important is that ObjC come from smallTalk……
Do we really need reactiveCocoa? No, not really. It won’t have any help for a engineer grow up. Yes, it does. it can help us clean code, clear logical, and centralize code implementation
What time is best to introduce reactiveCocoa?
The most important - it’s just a framework, a tool, not language.
An Sample Code of MVVM by completion App https://medium.com/@syshen/reactivecocoa-in-practice-4f04119efc68
Reference 2)http://ieeexplore.ieee.org/xpl/login.jsp?tp=&arnumber=6827095&url=http%3A%2F%2Fieeexplore.ieee.org%2Fxpls%2Fabs_all.jsp%3Farnumber%3D6827095
3)http://www.diva-portal.org/smash/get/diva2:738269/FULLTEXT01.pdfw&bvm=bv.80642063,d.eXY
4)http://www.itu.dk/courses/VOP/E2005/VOP2005E/8_mvc_krasner_and_pope.pdf
5)https://msdn.microsoft.com/en-us/library/hh848246.aspx 6)http://www.sprynthesis.com/2014/12/06/reactivecocoa-mvvm-introduction/
7)http://www.objc.io/issue-13/mvvm.html 8)http://www.itiger.me/?p=38 (a lot of sample code)
Q & A
Thanks