Upgrade to Pro — share decks privately, control downloads, hide ads and more …

RxJava in Baby Steps

Annyce D.
October 31, 2017

RxJava in Baby Steps

Reactive Programming with RxJava has widely been adopted by both backend services and Android applications alike. Yet, the steep learning curve leaves many developers hesitant about adding it to their own Software tool belt. I was one such developer. Over the past two years, I’ve watched countless videos, read numerous blog posts and attended several conference talks on the subject. Yet, I often left each experience feeling only slightly more knowledgeable, but not quite empowered to start using RxJava in my apps. That’s not going to happen in this talk!

We cover the bare minimum concepts you need to grok, in order to start using RxJava today. In particular, we focus on:
* The 3 O’s: Observable, Observer and Operator
* The most common Operators: map(), flatMap(), and filter()
* Understanding those Marble Diagrams

Annyce D.

October 31, 2017
Tweet

More Decks by Annyce D.

Other Decks in Programming

Transcript

  1. a learning curve

    View full-size slide

  2. a steep learning curve

    View full-size slide

  3. you
    a steep learning curve

    View full-size slide

  4. superstar
    a steep learning curve
    you

    View full-size slide

  5. you
    superstar
    a steep learning curve

    View full-size slide

  6. you
    superstar
    a steep learning curve
    me

    View full-size slide

  7. RxJava in baby steps
    @brwngrldev

    View full-size slide

  8. asynchronous data streams

    View full-size slide

  9. GPS Updates
    Time

    View full-size slide

  10. GPS Updates
    Time
    -36.34543, 3.23445

    View full-size slide

  11. -36.34543, 3.23445

    -36.24543, 3.23425

    GPS Updates
    Time

    View full-size slide

  12. -36.34543, 3.23445

    -36.24543, 3.23425

    -35.34543, 3.13445
    GPS Updates
    Time

    View full-size slide

  13. Time
    server response

    View full-size slide

  14. i want
    toys!!!
    Time
    server response

    View full-size slide

  15. Time
    server response
    toys

    View full-size slide

  16. Time
    i want
    toys!!!
    server response

    View full-size slide

  17. Time
    server response

    View full-size slide

  18. Which of the following is an
    asynchronous data stream?
    A: click events
    B: database access
    C: server response
    D: all of the above

    View full-size slide

  19. A: click events
    B: database access
    C: server response
    D: all of the above
    Which of the following is an
    asynchronous data stream?

    View full-size slide

  20. scientific Research

    View full-size slide

  21. scientific Research

    View full-size slide

  22. Data Transformati
    on
    Observable.just(5, 6, 7)
    .map { ";-) ".repeat(it) }
    .subscribe { println(it) }

    View full-size slide

  23. Data Transformati
    on
    Observable.just(5, 6, 7)
    .map { ";-) ".repeat(it) }
    .subscribe { println(it) }
    ;-) ;-) ;-) ;-) ;-)
    ;-) ;-) ;-) ;-) ;-) ;-)
    ;-) ;-) ;-) ;-) ;-) ;-) ;-)

    View full-size slide

  24. chaining
    Observable.just(5, 6, 7)
    .map { ";-) ".repeat(it) }
    .filter { it.length < 24 }
    .subscribe { println(it) }

    View full-size slide

  25. chaining
    ;-) ;-) ;-) ;-) ;-)
    Observable.just(5, 6, 7)
    .map { ";-) ".repeat(it) }
    .filter { it.length < 24 }
    .subscribe { println(it) }

    View full-size slide

  26. RxJava is. . . ?
    A: the silver bullet
    B: simply magic
    C: pure voodoo
    D: a library

    View full-size slide

  27. RxJava is. . . ?
    A: the silver bullet
    B: simply magic
    C: pure voodoo
    D: a library

    View full-size slide

  28. listOf(5, 6, 7)
    .map { it * 5 }
    .filter { it > 25 }
    kotlin collecti
    ons

    View full-size slide

  29. listOf(5, 6, 7)
    .map { it * 5 }
    .filter { it > 25 }
    kotlin collecti
    ons
    5 6 7

    View full-size slide

  30. listOf(5, 6, 7)
    .map { it * 5 }
    .filter { it > 25 }
    kotlin collecti
    ons
    5 6 7
    map
    25 30 35

    View full-size slide

  31. listOf(5, 6, 7)
    .map { it * 5 }
    .filter { it > 25 }
    kotlin collecti
    ons
    5 6 7
    map
    25 30 35
    filter
    30 35

    View full-size slide

  32. listOf(5, 6, 7)
    .asSequence()
    .map { it * 5 }
    .filter { it > 25 }
    .toList()
    kotlin sequences

    View full-size slide

  33. kotlin sequences
    listOf(5, 6, 7)
    .asSequence()
    .map { it * 5 }
    .filter { it > 25 }
    .toList()
    5 6 7

    View full-size slide

  34. 5 6 7
    map
    filter
    kotlin sequences
    25
    listOf(5, 6, 7)
    .asSequence()
    .map { it * 5 }
    .filter { it > 25 }
    .toList()

    View full-size slide

  35. 5 6 7
    map
    filter
    kotlin sequences
    25 30
    30
    listOf(5, 6, 7)
    .asSequence()
    .map { it * 5 }
    .filter { it > 25 }
    .toList()

    View full-size slide

  36. 5 6 7
    map
    filter
    kotlin sequences
    25 30 35
    30 35
    listOf(5, 6, 7)
    .asSequence()
    .map { it * 5 }
    .filter { it > 25 }
    .toList()

    View full-size slide

  37. asynchronous data streams

    View full-size slide

  38. RxJava
    numbers
    .map { it * 5 }
    .filter { it > 25 }
    .subscribe()

    View full-size slide

  39. RxJava
    numbers
    .map { it * 5 }
    .filter { it > 25 }
    .subscribe()
    5
    25
    map
    filter

    View full-size slide

  40. RxJava
    numbers
    .map { it * 5 }
    .filter { it > 25 }
    .subscribe()
    5 6
    map
    filter
    25 30
    30

    View full-size slide

  41. RxJava
    numbers
    .map { it * 5 }
    .filter { it > 25 }
    .subscribe()
    5 6
    map
    filter
    25 30
    30 35
    7
    35
    35

    View full-size slide

  42. flexible
    threading

    View full-size slide

  43. Observable.just(5, 6, 7)
    .map { ";-) ".repeat(it) }
    .subscribe { println(it) }

    View full-size slide

  44. Observable.just(5, 6, 7)
    .subscribeOn(Schedulers.io())
    .map { ";-) ".repeat(it) }
    .subscribe { println(it) }

    View full-size slide

  45. The Basics
    observable

    View full-size slide

  46. The Basics
    observable
    observer

    View full-size slide

  47. The Basics
    operators observable
    observer

    View full-size slide

  48. hot observable
    Time

    View full-size slide

  49. hot observable
    Time
    i want
    hugs!!!

    View full-size slide

  50. hot observable
    Time
    hugs

    View full-size slide

  51. hot observable
    Time
    hugs hugs

    View full-size slide

  52. hot observable
    Time
    hugs hugs hugs

    View full-size slide

  53. Cold observable
    Time

    View full-size slide

  54. Cold observable
    Time

    View full-size slide

  55. Cold observable
    Time

    View full-size slide

  56. Cold observable
    Time
    hugs

    View full-size slide

  57. Cold observable
    Time
    hugs hugs

    View full-size slide

  58. Cold observable
    Time
    hugs hugs hugs

    View full-size slide

  59. Observable.create { subscriber -> }

    View full-size slide

  60. Observable.create { subscriber -> }
    Observable.just(item1, item2, item3)

    View full-size slide

  61. Observable.create { subscriber -> }
    Observable.just(item1, item2, item3)
    Observable.interval(2, TimeUnit.SECONDS)

    View full-size slide

  62. Observable.create { subscriber ->
    }

    View full-size slide

  63. Observable.create { subscriber ->
    Logger.log("create")
    Logger.log("complete")
    }
    Logger.log("done")

    View full-size slide

  64. Observable.create { subscriber ->
    Logger.log("create")
    subscriber.onNext(5)
    subscriber.onNext(6)
    subscriber.onNext(7)
    Logger.log("complete")
    }
    Logger.log("done")

    View full-size slide

  65. Observable.create { subscriber ->
    Logger.log("create")
    subscriber.onNext(5)
    subscriber.onNext(6)
    subscriber.onNext(7)
    subscriber.onComplete()
    Logger.log("complete")
    }
    Logger.log("done")

    View full-size slide

  66. A: emit items
    B: be cold
    C: be hot
    D: all of the above
    Observables can. . .

    View full-size slide

  67. A: emit items
    B: be cold
    C: be hot
    D: all of the above
    Observables can. . .

    View full-size slide

  68. interface Observer {
    fun onError(e: Throwable)
    fun onComplete()
    fun onNext(t: T)
    fun onSubscribe(d: Disposable)
    }

    View full-size slide

  69. interface Observer {
    fun onError(e: Throwable)
    fun onComplete()
    fun onNext(t: T)
    fun onSubscribe(d: Disposable)
    }

    View full-size slide

  70. interface Observer {
    fun onError(e: Throwable)
    fun onComplete()
    fun onNext(t: T)
    fun onSubscribe(d: Disposable)
    }

    View full-size slide

  71. interface Observer {
    fun onError(e: Throwable)
    fun onComplete()
    fun onNext(t: T)
    fun onSubscribe(d: Disposable)
    }

    View full-size slide

  72. interface Observer {
    fun onError(e: Throwable)
    fun onComplete()
    fun onNext(t: T)
    fun onSubscribe(d: Disposable)
    }

    View full-size slide

  73. observer’s lifecycle
    onSubscribe

    View full-size slide

  74. observer’s lifecycle
    onNext
    Normal
    flow
    onSubscribe

    View full-size slide

  75. observer’s lifecycle
    onComplete
    Normal
    flow
    onSubscribe
    onNext

    View full-size slide

  76. observer’s lifecycle
    onComplete onError
    Normal
    flow
    onSubscribe
    onNext

    View full-size slide

  77. val observer = object : Observer {
    override fun onError(e: Throwable) {
    Logger.log(e)
    }
    override fun onComplete() {
    Logger.log("on complete")
    }
    override fun onNext(t: Int) {
    Logger.log("next: $t")
    }
    override fun onSubscribe(d: Disposable) {
    Logger.log("on subscribe")
    }
    }

    View full-size slide

  78. interface Consumer {
    fun accept(t: T)
    }

    View full-size slide

  79. val consumer = object : Consumer {
    override fun accept(t: Int) {
    Logger.log("next: $t")
    }
    }

    View full-size slide

  80. val consumer = Consumer { t -> Logger.log("next: $t") }
    obs.subscribe(consumer)
    consumer

    View full-size slide

  81. obs.subscribe(Consumer { t -> Logger.log("next: $t") })
    consumer

    View full-size slide

  82. obs.subscribe({ t -> Logger.log("next: $t") })
    consumer

    View full-size slide

  83. obs.subscribe{ t -> Logger.log("next: $t") }
    consumer

    View full-size slide

  84. obs.subscribe{ Logger.log("next: $it") }
    consumer

    View full-size slide

  85. A: have a lifecycle
    B: always complete
    C: Never Error
    D: all of the above
    Observers. . .

    View full-size slide

  86. Observers. . .
    A: have a lifecycle
    B: always complete
    C: Never Error
    D: all of the above

    View full-size slide

  87. Time
    Operator: map()

    View full-size slide

  88. Time
    Operator: map()
    :-)
    :-(

    View full-size slide

  89. Time
    Operator: map()
    :-)
    :-)
    :-(
    :-(

    View full-size slide

  90. Time
    Operator: map()
    :-)
    :-) :-)
    :-(
    :-(
    :-(

    View full-size slide

  91. Time
    Operator: map()
    :-)
    :-) :-) :-)
    :-(
    :-(
    :-(
    :-(

    View full-size slide

  92. Operator: map()
    Observable.just(5, 6, 7)
    .map { ";-) ".repeat(it) }
    .subscribe { println(it) }

    View full-size slide

  93. Operator: map()
    ;-) ;-) ;-) ;-) ;-)
    ;-) ;-) ;-) ;-) ;-) ;-)
    ;-) ;-) ;-) ;-) ;-) ;-) ;-)
    Observable.just(5, 6, 7)
    .map { ";-) ".repeat(it) }
    .subscribe { println(it) }

    View full-size slide

  94. Operator: map()
    Observable.just(5, 6, 7)
    .map(object: Function {
    override fun apply(t: Int): String {
    return ";-) ".repeat(t)
    }
    })
    .subscribe { println(it) }

    View full-size slide

  95. Operator: map()
    Observable.just(5, 6, 7)
    .map(object: Function {
    override fun apply(t: Int): String {
    return ";-) ".repeat(t)
    }
    })
    .subscribe { println(it) }

    View full-size slide

  96. Operator: map()
    Observable.just(5, 6, 7)
    .map(object: Function {
    override fun apply(t: Int): String {
    return ";-) ".repeat(t)
    }
    })
    .subscribe { println(it) }

    View full-size slide

  97. Operator: map()
    Observable.just(5, 6, 7)
    .map(object: Function {
    override fun apply(t: Int): String {
    return ";-) ".repeat(t)
    }
    })
    .subscribe { println(it) }

    View full-size slide

  98. .map(object: Function {
    override fun apply(t: Int): String {
    return ";-) ".repeat(t)
    }
    })
    .map { ";-) ".repeat(it) }

    View full-size slide

  99. what’s the output?
    Observable.just(1, 2, 3)
    .map { it * 2 }
    .subscribe { println(it) }

    View full-size slide

  100. A: 1, 2, 3
    B: a, b, c
    C: 2, 4, 6
    D: 6, 2, 4
    Observable.just(1, 2, 3)
    .map { it * 2 }
    .subscribe { println(it) }
    what’s the output?

    View full-size slide

  101. Observable.just(1, 2, 3)
    .map { it * 2 }
    .subscribe { println(it) }
    A: 1, 2, 3
    B: a, b, c
    C: 2, 4, 6
    D: 6, 2, 4
    what’s the output?

    View full-size slide

  102. what’s the output?
    Observable.just(1, 2, 3)
    .map { it * 2 }
    .filter { it < 6 }
    .subscribe { println(it) }

    View full-size slide

  103. A: 2, 3, 1
    B: 2, 4
    C: 1, 2, 3
    D: 6, 4
    what’s the output?
    Observable.just(1, 2, 3)
    .map { it * 2 }
    .filter { it < 6 }
    .subscribe { println(it) }

    View full-size slide

  104. what’s the output?
    Observable.just(1, 2, 3)
    .map { it * 2 }
    .filter { it < 6 }
    .subscribe { println(it) }
    A: 2, 3, 1
    B: 2, 4
    C: 1, 2, 3
    D: 6, 4

    View full-size slide

  105. Operator: flatmap()
    via reactivex.io

    View full-size slide

  106. Operator: flatmap()
    via reactivex.io
    item

    View full-size slide

  107. Operator: flatmap()
    via reactivex.io
    item observable

    View full-size slide

  108. Operator: flatmap()
    Observable.just( , )
    .flatMap( { Observable.just( ) } )
    .subscribe { println(it) }
    :-( :-(

    View full-size slide

  109. time
    flatmap
    :-(

    View full-size slide

  110. time
    flatmap
    :-(

    View full-size slide

  111. time
    flatmap
    :-(

    View full-size slide

  112. time
    flatmap
    :-( :-(

    View full-size slide

  113. time
    flatmap
    :-( :-(

    View full-size slide

  114. time
    flatmap
    :-( :-(

    View full-size slide

  115. time
    flatmap
    :-( :-(

    View full-size slide

  116. Long Running
    asynchronous

    View full-size slide

  117. Operator: flatmap()
    val users // Observable

    View full-size slide

  118. Operator: flatmap()
    val users // Observable
    val posts: Observable

    View full-size slide

  119. Operator: flatmap()
    val users // Observable
    val posts: Observable
    posts = users.flatMap { getUsersPosts(it.id) }

    View full-size slide

  120. Operator: flatmap()
    val users // Observable
    val posts: Observable
    posts = users.flatMap { getUsersPosts(it.id) }
    posts.subscribe { println(it) }

    View full-size slide

  121. via reactivex.io

    View full-size slide

  122. Flowable Maybe
    backpressure
    Disposable
    Single
    completable

    View full-size slide

  123. should you use
    rxjava?

    View full-size slide

  124. like functi
    onal programing?
    Process items asynchronously?
    compose data?
    handle errors gracefully?
    should you use
    rxjava?

    View full-size slide

  125. should you use
    rxjava?
    like functi
    onal programing?
    Process items asynchronously?
    compose data?
    handle errors gracefully?

    View full-size slide

  126. The Basics
    operators observable
    observer

    View full-size slide

  127. www.adavis.info
    @brwngrldev

    View full-size slide

  128. • Reactive Programming on Android with RxJava (http://amzn.to/2yOAkxn)

    • Reactive Programming with RxJava (http://amzn.to/2zQtqb5)

    • RxJava Playlist (https://goo.gl/9fw1Zv)

    • Learning RxJava for Android Devs (https://goo.gl/VWxFLK)

    • RxJava Video Course (https://caster.io/courses/rxjava)
    resources

    View full-size slide

  129. slide design:
    @lauraemilyillustrati
    on
    font: Elli
    ot 6, fontSquirrel.com

    View full-size slide