FRP: What does "declarative" mean

Peter Ovchinnikov
• CrossroadLabs - startups development environment
• Team lead of mobile team
• FRP + MVVM
• RE: {CODE} Lviv.
• Conferences
• Meetups
• Workshops
2

What the “declarative” really
mean
by Peter Ovchinnikov
3

Why go FRP
from mobile-team perspective:
• Clear code
• Avoid multithreading hell
• Reaction to changes using bindings.
• It’s easier to separate logic from UI. Controllers are thiner. MVVM!
5

Why go FRP
from Web team:
• Clasterisation.
• State-full servers and long pooling.
• Collaboration.
• WebSockets.
• Homogeneous micro-services
8

Reactive Manifesto
• Responsive
• Resilient
• Elastic
• Message Driven
9

Reactive Manifesto
Responsive
The system responds in a timely manner if
at all possible.
10

Reactive Manifesto
Resilient
The system stays responsive in the face of
failure
11

Reactive Manifesto
Elastic
The system stays responsive under
varying workload
12

Reactive Manifesto
Message Driven
Reactive Systems rely on asynchronous message-passing to establish a
boundary between components that ensures loose coupling, isolation and
location transparency
13

Reactive Manifesto
Message Driven
14

Reactive Manifesto
Actors Model
15

What is FRP
FRP is:
• functional
• reactive
• asynchronous
programming
26

Signals
observable
let one = Signal(0)
one.observe { print ($0) }
one.next(1) //prints “1”
27

Signals
bindable
let one = Signal(0)
let two = Signal(0)
one.bind(to: two) // one -> two
one.bind(fromTo: two) // one <-> two
28

Signals
MVVM able
let strSignal = Signal(“Text")
let label = UILabel()
label.bound(from: strSignal)
strSignal.next("New Label") //label reflects the
change on UI automatically
29

Signals
Functional
(convertible)
let one = Signal(0)
let two = Signal(0)
one.map { $0 + 1 }.bind(to: two)
one.next(1) // two = 2
30

Signals
Functional
(combinable into tuples):
let one = Signal(0), two = Signal(0)
let three = Signal(0), result = Signal(0)
one.zip(two).zip(three)
.map { $0 + $1 * $2 }.bind(to: result)
31

Signals
Functional
(filterable):
let one = Signal(0)
let two = Signal(0)
one.filter{ $0 > 5}.bind(to: two)
one.next(0) // two still 0
one.next(6) // two = 6
32

Signals
Functional
(flatMap):
Nobody knows how it should work.
33

Signals
Asynchronous
(context oriented)
let one = Signal(0)
one.on(ExecutionContext.main)
.observe{ print ($0) }
ExecutionContext.background.async{
one.next(1) // Prints 1 on main
}
34

Signals
Asynchronous
(debouncible)
let one = Signal(0)
one.debounce(0.1)
.observe{ print ("observe2", $0) }
one = 10
one = 20 // we see 20 only!!
35

Signals
Asynchronous
let one = Signal(0)
one.observe { print ("observer 1", $0) }
one.observe { print ("observer 2", $0) }
one.next(10) // guess order??? Who knows!!!
36

Promise/Futures
observable
let promise = Promise<Int>()
let future = promise.future
future.onSuccess { print($0) }
promise.success(10) // Prints 10
37

Promise/Futures
observable
future.onFailure { print($0) }
promise.failure(NSError()) // Prints Error
38

Promise/Futures
Functional
(convertible, filterable)
let future = Future(value: 10)
future.filter { $0 > 0}
.map { "($0)" }
.onSuccess{ print($0) } // Prints “10”
39

Promise/Futures
Functional
(combinable into tuples):
let future1 = Future(value: 10)
let future2 = Future(value: 20)
future1.zip(future2)
.map { $0 + $1 }
.onSuccess{ print($0) } // Prints 30
40

Promise/Futures
Functional
(chains the order):
func loadUser()->Future<User>
func loadUserDetails(user: User) -> Future<UserDetails>
loadUser()
.flatMap { loadUserDetails($0) }
.onSuccess{ print ($0) } //Prints user details!
41

Futures
Asynchronous
(context oriented)
future.on(ExecutionContext.main)
.onSuccess{ print ($0) }
ExecutionContext.background.async(in: .sec(2)) {
promise.success(10) // Will print 10 in 2 sec
}
42

Linear flows
44
let one = Signal()
let two = Signal()
let tree = Signal()
three.map { f2 }.bind(to: two)
two.map{ f1 }.bind(to: one)

Linear flows
45
var two {
didSet {
one = f1(newValue)
}
}
var three {
didSet {
two = f2(newValue)
}
}

One to many
46
let one = Signal()
let two = Signal()
let tree = Signal()
one.map { f1 }.bind(to: two)
one.map { f2 }.bind(to: tree)

One to many
47
var one {
didSet {
two = f1(newValue)
tree = f2(newValue)
}
}

Many to one
48
let one = Signal()
let two = Signal()
let tree = Signal()
one.zip(two).map { f($0, $1) }.bind(to: three)

Many to one
49
var one {
didSet {
three = f(newValue, two)
}
}
var two {
didSet {
three = f(one, newValue)
}
}

Order
51
func loadUser() -> User
func loadUserPosts(user: User) -> [Post]
func loadUserComments(user: User) -> [Comment]
func loadUserDetails(user: User) -> UserDetails
func printData(posts: [Post], comments: [Comment])
func login() {
let user = loadUser()
let userDetails = loadUserDetails(user: user)
let posts = loadUserPosts(user: user)
let comments = loadUserComments(user: user)
printData(posts: posts, comments: comments)
}

Order
52
func login() {
}

Order
53
func login() {
}

Order
54
func login() {
}

Order
55
func login() {
}

Order
56
func login() {
}

Order
57
func login() {
}

Order
59
Return
func loadUser() -> Future<User>
func loadUserPosts(user: User) -> Future<[Post]>
func loadUserComments(user: User) -> Future<[Comment]>
func loadUserDetails(user: User) -> Future<UserDetails>
func printData(posts: [Post], comments: [Comment]) -> Future<Void>

Order
60
Return
func login() -> Future<Void> {
let printData = user
.flatMap{ user in loadUserComments(user)
.zip{ loadUserComments(user) } }
.flatMap{ printData($0.0, $0.1) }
...

Order
61
Return
...
let userDetails = user.flatMap{ loadUserDetails($0) }
...

Order
62
Return
...
let printData = ... //Future<Void>
...
return printData.zip(userDetails).map {_ } // map to Future<Void>
}

Example
64
Name:
Password:
Login

Example
65
Name:
Password:
Login

Example
66
Name:
Password:
Login
Error:
Wrong login or password
OK

Example
class UserService {
func login(userName: String, password: String)-> Future<User>
}
...
class AppActions {
let showMainView = Signal<Void>()
let showError = Signal<Error>()
}

class LoginVM {
let error = Signal<Error>() // Handles error
let login = Signal<Void>() // Bound to UI, Handles login action
let name = Signal<String>() // Bound to UI
let password = Signal<String>() // Bound to UI
let busy = Signal<Bool>() // Bound to UI and shows/hides loader
...
Example

...
init(userService: UserService, actions: AppActions) {
//Busines logic
login // = Signal<Void>()
.with(weak: busy) // pass busy as weak pointer Signal
.with(value: name).with(value: password) //pass name, password as values
...
Example

...
.flatMap {
$0.0.bind(to: userService.login($0.1, $0.2)) // connect everything to real login
operation
}
...
Example

...
.feedError(to: error) // Guess what we have here
...
...
error.bind(to: actions.showError)
...
Example

...
.map {_ } // drop user to Signal<Void>
.bind(to: actions.showMainView) // pass signal to
...
Example

init(userService: UserService, actions: AppActions) {
//Busines logic
login // = Signal<Void>()
.with(weak: busy) // pass busy as weak pointer Signal
.with(value: name).with(value: password) //pass name, password as values
.flatMap{
$0.0.bind(to: userService.login($0.1, $0.2)) // connect everything to future
}
.feedError(to: error) // Guess what we have here
.map {_ } // drop user to Signal<Void>
.bind(to: actions.showMainView) // pass signal to
error.bind(to: actions.showError)
}
Example

class LoginController {
let login: UIButton!
let name: UITextField!
let password: UITextField!
func advise(vm: LoginVM) {
vm.name.bound(to: name)
vm.password.bound(to: password)
vm.login.bound(to: login)
vm.bind.bound(view.reactive.isActive)
}
}
Example

Why go FRP
from tech lead of mobile-team perspective:
If you need client application to be:
• Responsive
• Resilient
• Elastic
• Message Driven
FRP is for you!
76

Why go FRP
In additional you get:
• Clear code
• Avoid multithreading hell
• Reaction to changes using bindings.
• It’s easier to separate logic from UI. Controllers are thiner. MVVM!
77

FRP: What does "declarative" mean

More Related Content

What's hot (20)

Similar to FRP: What does "declarative" mean (20)

Recently uploaded (20)

FRP: What does "declarative" mean