MV(C, mvvm) in iOS and ReactiveCocoa

MV(C,VM) in iOS &
ReactiveCocoa
Neo

Outline
MV* 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* Family
Original
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]

Smalltalk’80 MVC
Microsoft MVVM
ref. from:[2]
ref. from:[2]
ref. from:[3]

Smalltalk’80 MVC
Microsoft MVVM
ref. from:[2]
ref. from:[2]
ref. from:[3]
ref. from:[4]

Smalltalk’80 MVC
Microsoft MVVM
ref. from:[2]
ref. from:[2]
ref. from:[3]
ref. from:[4]
ref. from:[5]

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 model
view No YES
model YES NO
MVC in iOS View model
view No NO
model NO NO
MVVM View model
view 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 View
delegate
Setter
Accessor Method
Notification 
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 pipe 
It’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 native 
2. Debug is difficult 
3. return value type always id.

How to start ReactiveCocoa(RAC)?
Getting started 
https://github.com/ReactiveCocoa/ReactiveCocoa#getting-started/
Framework overview 
https://github.com/ReactiveCocoa/ReactiveCocoa/blob/master/
Documentation/FrameworkOverview.md
There are many component to transfer and process data 
Signal, Subjects, Commands, Sequences, Schedulers, mapping, etc……
Familiar it, and then do it
[Simply Demo]

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)

MV(C, mvvm) in iOS and ReactiveCocoa

More Related Content

What's hot

Viewers also liked

Similar to MV(C, mvvm) in iOS and ReactiveCocoa

Recently uploaded

MV(C, mvvm) in iOS and ReactiveCocoa