Tech Talk #4 : Functional Reactive Programming - Đặng Thái Sơn

50
Reactive Thinking fb.me/dangthaison.91 | @dangthaison91

Transcript of Tech Talk #4 : Functional Reactive Programming - Đặng Thái Sơn

Page 1: Tech Talk #4 : Functional Reactive Programming - Đặng Thái Sơn

Reactive Thinking

fb.me/dangthaison.91 | @dangthaison91

Page 2: Tech Talk #4 : Functional Reactive Programming - Đặng Thái Sơn

FunctionalReactive

Programming

Page 3: Tech Talk #4 : Functional Reactive Programming - Đặng Thái Sơn

1. What is FRP?

Page 4: Tech Talk #4 : Functional Reactive Programming - Đặng Thái Sơn

Functional+

Reactive

Page 5: Tech Talk #4 : Functional Reactive Programming - Đặng Thái Sơn

Microsoft Excel

Page 6: Tech Talk #4 : Functional Reactive Programming - Đặng Thái Sơn

a = b + c

Page 7: Tech Talk #4 : Functional Reactive Programming - Đặng Thái Sơn

FRP: Streams of values over time

Page 8: Tech Talk #4 : Functional Reactive Programming - Đặng Thái Sơn
Page 9: Tech Talk #4 : Functional Reactive Programming - Đặng Thái Sơn

Core of FRP is Signal

Page 10: Tech Talk #4 : Functional Reactive Programming - Đặng Thái Sơn

Signal emits value over the

time

Page 11: Tech Talk #4 : Functional Reactive Programming - Đặng Thái Sơn

FRPis

Declarative

Page 12: Tech Talk #4 : Functional Reactive Programming - Đặng Thái Sơn

Imperative

Write correct sequence of codes in the correct order. Step by step. (How)

Declarative

Write code to describes what you want to do.

Page 13: Tech Talk #4 : Functional Reactive Programming - Đặng Thái Sơn

2. Why is FRP?

Page 14: Tech Talk #4 : Functional Reactive Programming - Đặng Thái Sơn

Example 1

Search API as you type but:

- Don't spam API server every seconds- Only make request if keyword changed- Cancel previous requests

Page 15: Tech Talk #4 : Functional Reactive Programming - Đặng Thái Sơn

Imperative

Page 16: Tech Talk #4 : Functional Reactive Programming - Đặng Thái Sơn

Declarative

Page 17: Tech Talk #4 : Functional Reactive Programming - Đặng Thái Sơn
Page 18: Tech Talk #4 : Functional Reactive Programming - Đặng Thái Sơn
Page 19: Tech Talk #4 : Functional Reactive Programming - Đặng Thái Sơn
Page 20: Tech Talk #4 : Functional Reactive Programming - Đặng Thái Sơn

Example 2

When the user starts simultaneously panning and rotating an object, start a countdown from 3.

Stop the timer either when the countdown ends or when the user stops the gestures.

Page 21: Tech Talk #4 : Functional Reactive Programming - Đặng Thái Sơn

Imperative

Page 22: Tech Talk #4 : Functional Reactive Programming - Đặng Thái Sơn

Imperative

Page 23: Tech Talk #4 : Functional Reactive Programming - Đặng Thái Sơn

Imperative

- When the user touches the screen - Check if a user is panning an object, store that information - Check if both gestures are running simultaneously - start a timer, from 3, counting down. - Check if the user is rotating an object, store that information - Check if both gestures are running simultaneously - start a timer, from 3, counting down. - Check if the user stopped panning - Stop the timer if needed - Check if the user stopped rotating - Stop the timer if needed

- When the timer ticks, decrease the number of seconds left - If the number of seconds left is zero, stop the timer*

Page 24: Tech Talk #4 : Functional Reactive Programming - Đặng Thái Sơn

There is a Better Way!

Page 25: Tech Talk #4 : Functional Reactive Programming - Đặng Thái Sơn

Declarative

Page 26: Tech Talk #4 : Functional Reactive Programming - Đặng Thái Sơn

Declarative

Page 27: Tech Talk #4 : Functional Reactive Programming - Đặng Thái Sơn

Declarative

Page 28: Tech Talk #4 : Functional Reactive Programming - Đặng Thái Sơn
Page 29: Tech Talk #4 : Functional Reactive Programming - Đặng Thái Sơn
Page 30: Tech Talk #4 : Functional Reactive Programming - Đặng Thái Sơn

Declarative

Page 31: Tech Talk #4 : Functional Reactive Programming - Đặng Thái Sơn

Declarative

Page 32: Tech Talk #4 : Functional Reactive Programming - Đặng Thái Sơn

Declarative

Define condition “simultaneously `panning` and `rotating`”Define condition “start a countdown from `3`”Define condition “when the user stops the gestures”Define what a timer is

When the user starts simultaneously `panning` and `rotating` an object, start a countdown from `3`.Stop the timer either when the countdown ends or when the user stops the gestures.”

Page 33: Tech Talk #4 : Functional Reactive Programming - Đặng Thái Sơn

Advantages• Code more concise & clear, easy to

understand without context

• Readability, highly express

• Make Asynchronous easier

• UI Binding

• Maintainability, Extensibility...

Page 34: Tech Talk #4 : Functional Reactive Programming - Đặng Thái Sơn

Imperative

Page 35: Tech Talk #4 : Functional Reactive Programming - Đặng Thái Sơn

Declarative

Page 36: Tech Talk #4 : Functional Reactive Programming - Đặng Thái Sơn

What we can do• Observables

• Transformations

• Composition

• Combination

• Filter

• Buffer...

Page 37: Tech Talk #4 : Functional Reactive Programming - Đặng Thái Sơn
Page 38: Tech Talk #4 : Functional Reactive Programming - Đặng Thái Sơn

Denial• FRP is hard, imperative is more easier

• FRP just is trend!

• Just another Framework

• Unnecessarily complex

Page 39: Tech Talk #4 : Functional Reactive Programming - Đặng Thái Sơn
Page 40: Tech Talk #4 : Functional Reactive Programming - Đặng Thái Sơn

3. Thinking in Reactive

Page 41: Tech Talk #4 : Functional Reactive Programming - Đặng Thái Sơn

FRP is hard, but it is SIMPLE

Page 42: Tech Talk #4 : Functional Reactive Programming - Đặng Thái Sơn

Imperative is EASY

Page 43: Tech Talk #4 : Functional Reactive Programming - Đặng Thái Sơn

Simplevs

Easy

Page 44: Tech Talk #4 : Functional Reactive Programming - Đặng Thái Sơn

Complexity

Page 45: Tech Talk #4 : Functional Reactive Programming - Đặng Thái Sơn

Simple made Easy— Rick Hickey

Page 46: Tech Talk #4 : Functional Reactive Programming - Đặng Thái Sơn

FRP is good Trend

Page 47: Tech Talk #4 : Functional Reactive Programming - Đặng Thái Sơn

Functional Reactive will be

RADIOACTIVE

Page 48: Tech Talk #4 : Functional Reactive Programming - Đặng Thái Sơn

More: https://goo.gl/lfNWlJBlog: https://dangthaison91.wordpress.com

Page 49: Tech Talk #4 : Functional Reactive Programming - Đặng Thái Sơn

Thank you!

Page 50: Tech Talk #4 : Functional Reactive Programming - Đặng Thái Sơn