A Pragmatic Reactive Architecture for Android

Presented on Mar '18 at Android Meetup at F22 Labs, Chennai.
https://www.meetup.com/Google-IO-Extended-Chennai/events/248296192/

Transcript

1. A Pragmatic Reactive Architecture for Android Ragunath Jawahar ragunathjawahar / Medium • Twitter • GitHub
3. Inspiration Cycle.js Redux
4. But, why?
5. RxJava
6. Why? 1. Predictable 2. Platform Agnostic 3. User-centric 4. Reactive (Responsive / Resilient / Elastic / Message Driven) 5. Unidirectional
7. Model Presenter View
8. Toolbox (Subjective) • Kotlin • RxJava • RxAndroid • RxKotlin (Optional) • RxBinding • Retrofit • Room / SQL Brite • JUnit • Truth • Mockito • Espresso
9. Model • View • Intention
10. View Model Intention
11. EVERYTHING IS A STREAM Courtesy parkerblog.wordpress.com
12. Intention
13. Intent(ion) is a component whose sole responsibility is to translate user input events into model-friendly events. —André Staltz
14. Intent(ion) is a component whose sole responsibility is to translate user input events into model-friendly events. —André Staltz
15. Intent(ion) is a component whose sole responsibility is to translate user input events into model-friendly events. —André Staltz
16. View Model Intention
19. CounterIntentions.kt
20. class CounterIntentions( private val incrementClicks: Observable<Unit>, private val incrementBy5Clicks: Observable<Unit>, private val decrementClicks: Observable<Unit>, private val resetClicks: Observable<Unit> ) { fun increment(): Observable<Int> = incrementClicks.map { +1 } // increment by 5 … fun decrement(): Observable<Int> = decrementClicks.map { -1 } fun reset(): Observable<Unit> = resetClicks }
21. class CounterIntentions( private val incrementClicks: Observable<Unit>, private val incrementBy5Clicks: Observable<Unit>, private val decrementClicks: Observable<Unit>, private val resetClicks: Observable<Unit> ) { fun increment(): Observable<Int> = incrementClicks.map { +1 } // increment by 5 … fun decrement(): Observable<Int> = decrementClicks.map { -1 } fun reset(): Observable<Unit> = resetClicks }
22. class CounterIntentions( private val incrementClicks: Observable<Unit>, private val incrementBy5Clicks: Observable<Unit>, private val decrementClicks: Observable<Unit>, private val resetClicks: Observable<Unit> ) { fun increment(): Observable<Int> = incrementClicks.map { +1 } // increment by 5 … fun decrement(): Observable<Int> = decrementClicks.map { -1 } fun reset(): Observable<Unit> = resetClicks }
23. class CounterIntentions( private val incrementClicks: Observable<Unit>, private val incrementBy5Clicks: Observable<Unit>, private val decrementClicks: Observable<Unit>, private val resetClicks: Observable<Unit> ) { fun increment(): Observable<Int> = incrementClicks.map { +1 } // increment by 5 … fun decrement(): Observable<Int> = decrementClicks.map { -1 } fun reset(): Observable<Unit> = resetClicks }
24. class CounterIntentions( private val incrementClicks: Observable<Unit>, private val incrementBy5Clicks: Observable<Unit>, private val decrementClicks: Observable<Unit>, private val resetClicks: Observable<Unit> ) { fun increment(): Observable<Int> = incrementClicks.map { +1 } // increment by 5 … fun decrement(): Observable<Int> = decrementClicks.map { -1 } fun reset(): Observable<Unit> = resetClicks }
25. class CounterIntentions( private val incrementClicks: Observable<Unit>, private val incrementBy5Clicks: Observable<Unit>, private val decrementClicks: Observable<Unit>, private val resetClicks: Observable<Unit> ) { fun increment(): Observable<Int> = incrementClicks.map { +1 } // increment by 5 … fun decrement(): Observable<Int> = decrementClicks.map { -1 } fun reset(): Observable<Unit> = resetClicks }
26. class CounterIntentions( private val incrementClicks: Observable<Unit>, private val incrementBy5Clicks: Observable<Unit>, private val decrementClicks: Observable<Unit>, private val resetClicks: Observable<Unit> ) { fun increment(): Observable<Int> = incrementClicks.map { +1 } // increment by 5 … fun decrement(): Observable<Int> = decrementClicks.map { -1 } fun reset(): Observable<Unit> = resetClicks }
27. class CounterIntentions( private val incrementClicks: Observable<Unit>, private val incrementBy5Clicks: Observable<Unit>, private val decrementClicks: Observable<Unit>, private val resetClicks: Observable<Unit> ) { fun increment(): Observable<Int> = incrementClicks.map { +1 } // increment by 5 … fun decrement(): Observable<Int> = decrementClicks.map { -1 } fun reset(): Observable<Unit> = resetClicks }
28. class CounterIntentions( private val incrementClicks: Observable<Unit>, private val incrementBy5Clicks: Observable<Unit>, private val decrementClicks: Observable<Unit>, private val resetClicks: Observable<Unit> ) { fun increment(): Observable<Int> = incrementClicks.map { +1 } // increment by 5 … fun decrement(): Observable<Int> = decrementClicks.map { -1 } fun reset(): Observable<Unit> = resetClicks }
29. class CounterIntentions( private val incrementClicks: Observable<Unit>, private val incrementBy5Clicks: Observable<Unit>, private val decrementClicks: Observable<Unit>, private val resetClicks: Observable<Unit> ) { fun increment(): Observable<Int> = incrementClicks.map { +1 } // increment by 5 … fun decrement(): Observable<Int> = decrementClicks.map { -1 } fun reset(): Observable<Unit> = resetClicks }
30. class CounterIntentions( private val incrementClicks: Observable<Unit>, private val incrementBy5Clicks: Observable<Unit>, private val decrementClicks: Observable<Unit>, private val resetClicks: Observable<Unit> ) { fun increment(): Observable<Int> = incrementClicks.map { +1 } // increment by 5 … fun decrement(): Observable<Int> = decrementClicks.map { -1 } fun reset(): Observable<Unit> = resetClicks }
31. class CounterIntentions( private val incrementClicks: Observable<Unit>, private val incrementBy5Clicks: Observable<Unit>, private val decrementClicks: Observable<Unit>, private val resetClicks: Observable<Unit> ) { fun increment(): Observable<Int> = incrementClicks.map { +1 } // increment by 5 … fun decrement(): Observable<Int> = decrementClicks.map { -1 } fun reset(): Observable<Unit> = resetClicks }
32. class CounterIntentions( private val incrementClicks: Observable<Unit>, private val incrementBy5Clicks: Observable<Unit>, private val decrementClicks: Observable<Unit>, private val resetClicks: Observable<Unit> ) { fun increment(): Observable<Int> = incrementClicks.map { +1 } // increment by 5 … fun decrement(): Observable<Int> = decrementClicks.map { -1 } fun reset(): Observable<Unit> = resetClicks }
33. Testing?
34. Model
35. View Model Intention
36. Courtesy 123Countries.com State Model
37. (Single Atom) State • Represents the state of your model • Should be normalized • UI state can always be derived from SAS, but not the other way around
38. State Reducer Reducer State New State Signal
39. CounterState.kt
40. @Parcelize data class CounterState( val counter: Int ) : Parcelable { companion object { val ZERO = CounterState(0) } fun add(number: Int): CounterState = this.copy(counter = counter + number) fun reset(): CounterState = CounterState.ZERO }
41. @Parcelize data class CounterState( val counter: Int ) : Parcelable { companion object { val ZERO = CounterState(0) } fun add(number: Int): CounterState = this.copy(counter = counter + number) fun reset(): CounterState = CounterState.ZERO }
42. @Parcelize data class CounterState( val counter: Int ) : Parcelable { companion object { val ZERO = CounterState(0) } fun add(number: Int): CounterState = this.copy(counter = counter + number) fun reset(): CounterState = CounterState.ZERO }
43. @Parcelize data class CounterState( val counter: Int ) : Parcelable { companion object { val ZERO = CounterState(0) } fun add(number: Int): CounterState = this.copy(counter = counter + number) fun reset(): CounterState = CounterState.ZERO }
44. @Parcelize data class CounterState( val counter: Int ) : Parcelable { companion object { val ZERO = CounterState(0) } fun add(number: Int): CounterState = this.copy(counter = counter + number) fun reset(): CounterState = CounterState.ZERO }
45. @Parcelize data class CounterState( val counter: Int ) : Parcelable { companion object { val ZERO = CounterState(0) } fun add(number: Int): CounterState = this.copy(counter = counter + number) fun reset(): CounterState = CounterState.ZERO }
46. @Parcelize data class CounterState( val counter: Int ) : Parcelable { companion object { val ZERO = CounterState(0) } fun add(number: Int): CounterState = this.copy(counter = counter + number) fun reset(): CounterState = CounterState.ZERO }
47. @Parcelize data class CounterState( val counter: Int ) : Parcelable { companion object { val ZERO = CounterState(0) } fun add(number: Int): CounterState = this.copy(counter = counter + number) fun reset(): CounterState = CounterState.ZERO }
48. @Parcelize data class CounterState( val counter: Int ) : Parcelable { companion object { val ZERO = CounterState(0) } fun add(number: Int): CounterState = this.copy(counter = counter + number) fun reset(): CounterState = CounterState.ZERO }
49. @Parcelize data class CounterState( val counter: Int ) : Parcelable { companion object { val ZERO = CounterState(0) } fun add(number: Int): CounterState = this.copy(counter = counter + number) fun reset(): CounterState = CounterState.ZERO }
50. @Parcelize data class CounterState( val counter: Int ) : Parcelable { companion object { val ZERO = CounterState(0) } fun add(number: Int): CounterState = this.copy(counter = counter + number) fun reset(): CounterState = CounterState.ZERO }
51. @Parcelize data class CounterState( val counter: Int ) : Parcelable { companion object { val ZERO = CounterState(0) } fun add(number: Int): CounterState = this.copy(counter = counter + number) fun reset(): CounterState = CounterState.ZERO }
52. @Parcelize data class CounterState( val counter: Int ) : Parcelable { companion object { val ZERO = CounterState(0) } fun add(number: Int): CounterState = this.copy(counter = counter + number) fun reset(): CounterState = CounterState.ZERO }
53. @Parcelize data class CounterState( val counter: Int ) : Parcelable { companion object { val ZERO = CounterState(0) } fun add(number: Int): CounterState = this.copy(counter = counter + number) fun reset(): CounterState = CounterState.ZERO }
54. @Parcelize data class CounterState( val counter: Int ) : Parcelable { companion object { val ZERO = CounterState(0) } fun add(number: Int): CounterState = this.copy(counter = counter + number) fun reset(): CounterState = CounterState.ZERO }
55. @Parcelize data class CounterState( val counter: Int ) : Parcelable { companion object { val ZERO = CounterState(0) } fun add(number: Int): CounterState = this.copy(counter = counter + number) fun reset(): CounterState = CounterState.ZERO }
56. @Parcelize data class CounterState( val counter: Int ) : Parcelable { companion object { val ZERO = CounterState(0) } fun add(number: Int): CounterState = this.copy(counter = counter + number) fun reset(): CounterState = CounterState.ZERO }
57. @Parcelize data class CounterState( val counter: Int ) : Parcelable { companion object { val ZERO = CounterState(0) } fun add(number: Int): CounterState = this.copy(counter = counter + number) fun reset(): CounterState = CounterState.ZERO }
58. @Parcelize data class CounterState( val counter: Int ) : Parcelable { companion object { val ZERO = CounterState(0) } fun add(number: Int): CounterState = this.copy(counter = counter + number) fun reset(): CounterState = CounterState.ZERO }
59. @Parcelize data class CounterState( val counter: Int ) : Parcelable { companion object { val ZERO = CounterState(0) } fun add(number: Int): CounterState = this.copy(counter = counter + number) fun reset(): CounterState = CounterState.ZERO }
60. CounterModel.kt
61. object CounterModel { fun bind( intentions: CounterIntentions, bindings: Observable<Binding>, states: Observable<CounterState> ): Observable<CounterState> { val numbers = Observable.merge( intentions.increment(), intentions.incrementBy5(), intentions.decrement() ) return Observable.merge( newBindingUseCase(bindings), restoredBindingUseCase(bindings, states), incrementDecrementUseCase(numbers, states), resetUseCase(intentions.reset()) ) } // More functions… }
62. object CounterModel { fun bind( intentions: CounterIntentions, bindings: Observable<Binding>, states: Observable<CounterState> ): Observable<CounterState> { val numbers = Observable.merge( intentions.increment(), intentions.incrementBy5(), intentions.decrement() ) return Observable.merge( newBindingUseCase(bindings), restoredBindingUseCase(bindings, states), incrementDecrementUseCase(numbers, states), resetUseCase(intentions.reset()) ) } // More functions… }
63. object CounterModel { fun bind( intentions: CounterIntentions, bindings: Observable<Binding>, states: Observable<CounterState> ): Observable<CounterState> { val numbers = Observable.merge( intentions.increment(), intentions.incrementBy5(), intentions.decrement() ) return Observable.merge( newBindingUseCase(bindings), restoredBindingUseCase(bindings, states), incrementDecrementUseCase(numbers, states), resetUseCase(intentions.reset()) ) } // More functions… }
64. object CounterModel { fun bind( intentions: CounterIntentions, bindings: Observable<Binding>, states: Observable<CounterState> ): Observable<CounterState> { val numbers = Observable.merge( intentions.increment(), intentions.incrementBy5(), intentions.decrement() ) return Observable.merge( newBindingUseCase(bindings), restoredBindingUseCase(bindings, states), incrementDecrementUseCase(numbers, states), resetUseCase(intentions.reset()) ) } // More functions… }
65. object CounterModel { fun bind( intentions: CounterIntentions, bindings: Observable<Binding>, states: Observable<CounterState> ): Observable<CounterState> { val numbers = Observable.merge( intentions.increment(), intentions.incrementBy5(), intentions.decrement() ) return Observable.merge( newBindingUseCase(bindings), restoredBindingUseCase(bindings, states), incrementDecrementUseCase(numbers, states), resetUseCase(intentions.reset()) ) } // More functions… }
66. object CounterModel { fun bind( intentions: CounterIntentions, bindings: Observable<Binding>, states: Observable<CounterState> ): Observable<CounterState> { val numbers = Observable.merge( intentions.increment(), intentions.incrementBy5(), intentions.decrement() ) return Observable.merge( newBindingUseCase(bindings), restoredBindingUseCase(bindings, states), incrementDecrementUseCase(numbers, states), resetUseCase(intentions.reset()) ) } // More functions… }
67. object CounterModel { fun bind( intentions: CounterIntentions, bindings: Observable<Binding>, states: Observable<CounterState> ): Observable<CounterState> { val numbers = Observable.merge( intentions.increment(), intentions.incrementBy5(), intentions.decrement() ) return Observable.merge( newBindingUseCase(bindings), restoredBindingUseCase(bindings, states), incrementDecrementUseCase(numbers, states), resetUseCase(intentions.reset()) ) } // More functions… }
68. object CounterModel { fun bind( intentions: CounterIntentions, bindings: Observable<Binding>, states: Observable<CounterState> ): Observable<CounterState> { val numbers = Observable.merge( intentions.increment(), intentions.incrementBy5(), intentions.decrement() ) return Observable.merge( newBindingUseCase(bindings), restoredBindingUseCase(bindings, states), incrementDecrementUseCase(numbers, states), resetUseCase(intentions.reset()) ) } // More functions… }
69. object CounterModel { fun bind( intentions: CounterIntentions, bindings: Observable<Binding>, states: Observable<CounterState> ): Observable<CounterState> { val numbers = Observable.merge( intentions.increment(), intentions.incrementBy5(), intentions.decrement() ) return Observable.merge( newBindingUseCase(bindings), restoredBindingUseCase(bindings, states), incrementDecrementUseCase(numbers, states), resetUseCase(intentions.reset()) ) } // More functions… }
70. object CounterModel { fun bind( intentions: CounterIntentions, bindings: Observable<Binding>, states: Observable<CounterState> ): Observable<CounterState> { val numbers = Observable.merge( intentions.increment(), intentions.incrementBy5(), intentions.decrement() ) return Observable.merge( newBindingUseCase(bindings), restoredBindingUseCase(bindings, states), incrementDecrementUseCase(numbers, states), resetUseCase(intentions.reset()) ) } // More functions… }
71. object CounterModel { fun bind( intentions: CounterIntentions, bindings: Observable<Binding>, states: Observable<CounterState> ): Observable<CounterState> { val numbers = Observable.merge( intentions.increment(), intentions.incrementBy5(), intentions.decrement() ) return Observable.merge( newBindingUseCase(bindings), restoredBindingUseCase(bindings, states), incrementDecrementUseCase(numbers, states), resetUseCase(intentions.reset()) ) } // More functions… }
72. object CounterModel { fun bind( intentions: CounterIntentions, bindings: Observable<Binding>, states: Observable<CounterState> ): Observable<CounterState> { val numbers = Observable.merge( intentions.increment(), intentions.incrementBy5(), intentions.decrement() ) return Observable.merge( newBindingUseCase(bindings), restoredBindingUseCase(bindings, states), incrementDecrementUseCase(numbers, states), resetUseCase(intentions.reset()) ) } // More functions… }
73. object CounterModel { fun bind( intentions: CounterIntentions, bindings: Observable<Binding>, states: Observable<CounterState> ): Observable<CounterState> { val numbers = Observable.merge( intentions.increment(), intentions.incrementBy5(), intentions.decrement() ) return Observable.merge( newBindingUseCase(bindings), restoredBindingUseCase(bindings, states), incrementDecrementUseCase(numbers, states), resetUseCase(intentions.reset()) ) } // More functions… }
74. Use Case - New Binding private fun newBindingUseCase( bindings: Observable<Binding> ): Observable<CounterState> { return bindings .filter { it == Binding.NEW } .map { CounterState.ZERO } }
75. Use Case - New Binding private fun newBindingUseCase( bindings: Observable<Binding> ): Observable<CounterState> { return bindings .filter { it == Binding.NEW } .map { CounterState.ZERO } }
76. Use Case - New Binding private fun newBindingUseCase( bindings: Observable<Binding> ): Observable<CounterState> { return bindings .filter { it == Binding.NEW } .map { CounterState.ZERO } }
77. Use Case - New Binding private fun newBindingUseCase( bindings: Observable<Binding> ): Observable<CounterState> { return bindings .filter { it == Binding.NEW } .map { CounterState.ZERO } }
78. Use Case - New Binding private fun newBindingUseCase( bindings: Observable<Binding> ): Observable<CounterState> { return bindings .filter { it == Binding.NEW } .map { CounterState.ZERO } }
79. Use Case - New Binding private fun newBindingUseCase( bindings: Observable<Binding> ): Observable<CounterState> { return bindings .filter { it == Binding.NEW } .map { CounterState.ZERO } }
80. Use Case - Restored Binding private fun restoredBindingUseCase( bindings: Observable<Binding>, states: Observable<CounterState> ): ObservableSource<CounterState> { return bindings .filter { it == Binding.RESTORED } .withLatestFrom(states) { _, previousState -> previousState } }
81. Use Case - Restored Binding private fun restoredBindingUseCase( bindings: Observable<Binding>, states: Observable<CounterState> ): ObservableSource<CounterState> { return bindings .filter { it == Binding.RESTORED } .withLatestFrom(states) { _, previousState -> previousState } }
82. Use Case - Restored Binding private fun restoredBindingUseCase( bindings: Observable<Binding>, states: Observable<CounterState> ): ObservableSource<CounterState> { return bindings .filter { it == Binding.RESTORED } .withLatestFrom(states) { _, previousState -> previousState } }
83. Use Case - Restored Binding private fun restoredBindingUseCase( bindings: Observable<Binding>, states: Observable<CounterState> ): ObservableSource<CounterState> { return bindings .filter { it == Binding.RESTORED } .withLatestFrom(states) { _, previousState -> previousState } }
84. Use Case - Restored Binding private fun restoredBindingUseCase( bindings: Observable<Binding>, states: Observable<CounterState> ): ObservableSource<CounterState> { return bindings .filter { it == Binding.RESTORED } .withLatestFrom(states) { _, previousState -> previousState } }
85. Use Case - Restored Binding private fun restoredBindingUseCase( bindings: Observable<Binding>, states: Observable<CounterState> ): ObservableSource<CounterState> { return bindings .filter { it == Binding.RESTORED } .withLatestFrom(states) { _, previousState -> previousState } }
86. Use Case - Increment / Decrement private fun incrementDecrementUseCase( numbers: Observable<Int>, states: Observable<CounterState> ): Observable<CounterState> { return numbers.withLatestFrom(states) { number, previousState -> previousState.add(number) } }
87. Use Case - Increment / Decrement private fun incrementDecrementUseCase( numbers: Observable<Int>, states: Observable<CounterState> ): Observable<CounterState> { return numbers.withLatestFrom(states) { number, previousState -> previousState.add(number) } }
88. Use Case - Increment / Decrement private fun incrementDecrementUseCase( numbers: Observable<Int>, states: Observable<CounterState> ): Observable<CounterState> { return numbers.withLatestFrom(states) { number, previousState -> previousState.add(number) } }
89. Use Case - Increment / Decrement private fun incrementDecrementUseCase( numbers: Observable<Int>, states: Observable<CounterState> ): Observable<CounterState> { return numbers.withLatestFrom(states) { number, previousState -> previousState.add(number) } }
90. Use Case - Increment / Decrement private fun incrementDecrementUseCase( numbers: Observable<Int>, states: Observable<CounterState> ): Observable<CounterState> { return numbers.withLatestFrom(states) { number, previousState -> previousState.add(number) } }
91. Use Case - Increment / Decrement private fun incrementDecrementUseCase( numbers: Observable<Int>, states: Observable<CounterState> ): Observable<CounterState> { return numbers.withLatestFrom(states) { number, previousState -> previousState.add(number) } }
92. Use Case - Reset private fun resetUseCase( reset: Observable<Unit> ): Observable<CounterState> { return reset.map { CounterState.ZERO } }
93. Use Case - Reset private fun resetUseCase( reset: Observable<Unit> ): Observable<CounterState> { return reset.map { CounterState.ZERO } }
94. Use Case - Reset private fun resetUseCase( reset: Observable<Unit> ): Observable<CounterState> { return reset.map { CounterState.ZERO } }
95. Use Case - Reset private fun resetUseCase( reset: Observable<Unit> ): Observable<CounterState> { return reset.map { CounterState.ZERO } }
96. Use Case - Reset private fun resetUseCase( reset: Observable<Unit> ): Observable<CounterState> { return reset.map { CounterState.ZERO } }
97. Don’t scan() (Recommendation) • Introduces additional abstraction because it requires heterogeneous streams
98. View
99. View Model Intention
100. CounterView.kt
101. interface CounterView { fun displayCounter(value: Int) }
102. interface CounterView { fun displayCounter(value: Int) }
103. CounterViewDriver.kt
104. class CounterViewDriver : ViewDriver<CounterView, CounterState> { override fun render(view: CounterView, state: CounterState) { view.displayCounter(state.counter) } }
105. class CounterViewDriver : ViewDriver<CounterView, CounterState> { override fun render(view: CounterView, state: CounterState) { view.displayCounter(state.counter) } }
106. class CounterViewDriver : ViewDriver<CounterView, CounterState> { override fun render(view: CounterView, state: CounterState) { view.displayCounter(state.counter) } }
107. class CounterViewDriver : ViewDriver<CounterView, CounterState> { override fun render(view: CounterView, state: CounterState) { view.displayCounter(state.counter) } }
108. class CounterViewDriver : ViewDriver<CounterView, CounterState> { override fun render(view: CounterView, state: CounterState) { view.displayCounter(state.counter) } }
109. class CounterViewDriver : ViewDriver<CounterView, CounterState> { override fun render(view: CounterView, state: CounterState) { view.displayCounter(state.counter) } }
110. The Good • Wholistic • Testable • Easy to debug • Reduction in the number of unknowns
111. The Bad • Very steep learning curve
113. References • https://www.youtube.com/watch?v=1zj7M1LnJV4 • https://cycle.js.org/getting-started.html • https://egghead.io/courses/cycle-js-fundamentals • https://redux.js.org • https://egghead.io/courses/getting-started-with-redux • https://github.com/ragunathjawahar/kitchen-sink
114. Medium • Twitter • GitHub @ragunathjawahar