Successfully reported this slideshow.
We use your LinkedIn profile and activity data to personalize ads and to show you more relevant ads. You can change your ad preferences anytime.

Multiplatform architecture ribs in swift

206 views

Published on

Multiplatform architecture ribs in swift

Published in: Technology
  • Be the first to comment

  • Be the first to like this

Multiplatform architecture ribs in swift

  1. 1. VCNC RIBs 김남현 VCNC (타다 / Between*) Multi-platform architecture
  2. 2. Table of Contents 1 Why a new architecture? 2 RIBs at Uber 3 What we got from RIBs 4 What we’re struggling with
  3. 3. Why a new architecture? 3 different apps in 2 platforms
  4. 4. Why a new architecture? Project started 2018.06 Driver α 2018.07 2018.08 2018.09 2018.10 Rider α Beta Public release
  5. 5. Factors to consider No MVC (no MVVM or MVP, too) - MVC stands for Massive View Controller - Keeping components simple Map-based application - We’re making a map-based application No time to create a framework from scratch - Conductor, Scoop, RIBs, …
  6. 6. Factors to consider No MVC (no MVVM or MVP, too) - MVC stands for Massive View Controller - Keeping components simple Map-based application - We’re making a map-based application No time to create a framework from scratch - Conductor, Scoop, RIBs, …
  7. 7. Factors to consider No MVC (no MVVM or MVP, too) - MVC stands for Massive View Controller - Keeping components simple Map-based application - We’re making a map-based application No time to create a framework from scratch - Conductor, Scoop, RIBs, …
  8. 8. Multi-platform architecture https://github.com/uber/RIBs
  9. 9. Uber RIBs RouterInteractorBuilder
  10. 10. Uber RIBs Router Interactor Builder
  11. 11. Uber RIBs Router Interactor Builder Presenter View
  12. 12. Uber RIBs Router Interactor Builder Presenter View Business logic (a.k.a. brain of the app)
  13. 13. Uber RIBs Router Interactor Builder Presenter View Helper for routing between RIBs
  14. 14. Uber RIBs Router Interactor Builder Presenter View Build RIB units
  15. 15. Uber RIBs Router Interactor Builder Presenter View Layout & Animation
  16. 16. Uber RIBs Router Interactor Builder Presenter View Translation logic
  17. 17. Uber RIBs Router Interactor Builder Presenter View
  18. 18. Convoluted state machines Change Email Home Screen Menu Search for Location Change Vehicle Options Refine Location Request Vehicle Vehicle Matched Receipt On trip Verify Phone Number
  19. 19. State tree Root MainLoggedOut MenuRequest Ride LocationEditor Confirm Refinement Coupon DroppedOff Card MatchedPending Viewless Viewful Email, PW, ...
  20. 20. RIB tree Root MainLoggedOut MenuRequest LocationEditor Confirm Refinement Coupon Card Viewless Viewful Ride DroppedOffMatchedPending Email, PW, ...
  21. 21. RIB tree Root MainLoggedOut MenuRequest LocationEditor Confirm Refinement Coupon Card Viewless Viewful Ride DroppedOffMatchedPending Email, PW, ...
  22. 22. RIB tree Viewless Viewful LoggedOut Menu LocationEditor Refinement Root Main Request Confirm Coupon Card Ride DroppedOffMatchedPending Email, PW, ...
  23. 23. RIB tree Root MainLoggedOut MenuRequest LocationEditor Confirm Refinement Coupon Card Viewless Viewful Ride DroppedOffMatchedPending Email, PW, ...
  24. 24. RIB tree Root MainLoggedOut MenuRequest LocationEditor Confirm Refinement Coupon Card Viewless Viewful Ride DroppedOffMatchedPending Email, PW, ...
  25. 25. RIB tree Root MainLoggedOut MenuRequest LocationEditor Confirm Refinement Coupon Card Viewless Viewful Ride DroppedOffMatchedPending Email, PW, ...
  26. 26. RIB tree Root MainLoggedOut MenuRequest LocationEditor Confirm Refinement Coupon Card Viewless Viewful Ride DroppedOffMatchedPending Email, PW, ...
  27. 27. View(ViewController) tree RootView MainView LocationEditor Confirm Refinement Coupon DroppedOff Card MatchedPending LoggedOut
  28. 28. Scopes Root
  29. 29. Root Scopes Main (logged in)
  30. 30. Scopes class AuthenticateNetworkRequest: NetworkRequest { private var authToken: String? public func makeRequest() { if let authToken = authToken { addAuthToken(authToken) } super.makeRequest() }
  31. 31. Scopes // `authToken` is not null in MainScope class AuthenticateNetworkRequest: NetworkRequest { private var authToken: String public func makeRequest() { addAuthToken(authToken) super.makeRequest() } }
  32. 32. Root Scopes Main Ride
  33. 33. Scopes public func refresh() { if let ride = self.ride { getRideStatus(ride.id) } else { getUserStatus(self.user!.id) } }
  34. 34. Scopes // `ride` is not null in RideScope public func refresh() { getRideStatus(self.ride.id) }
  35. 35. Communication between RIBs What if an interactor needs to inform another RIB of events? Main Home Request ??
  36. 36. Downwards communication Downwards communication via Rx. Places LocationStream on DI graph and cause Rx emissions. Main Receives LocationStream from DI graph. Subscribes to LocationStream. Home Receives LocationStream from DI graph. Subscribes to LocationStream. Request
  37. 37. Upwards communication Upwards communication with a Listener interface. Implements Home’s Listener interface. Main Declares listener interface. 
 Invoke listener.onRequest() to 
 notify parent when tap. Home
  38. 38. Efficiency in co-working Separation of concerns leads to a better modularization.
  39. 39. Efficiency in co-working Before RIBs After RIBs
  40. 40. Boilerplate ref) https://github.com/uber/RIBs/tree/master/ios/tooling/RIB.xctemplate
  41. 41. Screen stack can be used when you want to push 
 an entirely new “Screen”.
  42. 42. Screen stack can be used when you want to push 
 an entirely new “Screen”. UINavigationController is used as a Screen stack. But UINavigationController doesn’t support a transparent view.
  43. 43. Dependency Injection Components are used to manage the RIB dependencies.
  44. 44. Dagger Fully static, compile-time dependency injection framework for Android
  45. 45. iOS Using pure DI
  46. 46. Needle Compile-time safe Swift dependency injection framework But Needle doesn’t inject dependencies automatically.
  47. 47. What routers can do? contain simple and repetitive routing logic. create an additional abstraction layer. make it easier to test complex interactor logic. act as just a Helper?
  48. 48. What routers can do? Request LocationEditor Confirm Refinement Attached RIB should be tracked by Interactor or Router?
  49. 49. Animations
  50. 50. Animations Home Screen Search for Location UIViewControllerTransitioningDelegate optional func animationController(forPresented presented: UIViewController, presenting: UIViewController, source: UIViewController) -> UIViewControllerAnimatedTransitioning?
  51. 51. Animations Root Main Request LocationEditor Root Main MenuHome
  52. 52. Lifecycle Router, Interactor, Presenter, View Active Inactive Router willAttach didAttach willDetach didDetach RIBs emit lifecycle events
  53. 53. Wrap-up 1 Multi-platform architecture 2 Router, Inteactor, Builder, Presenter, and View 3 Business logic determines the state tree 4 Scopes 5 Communication between RIBs 6 Boilerplate, Screen stack, DI,
 Router, Animation, Lifecycle

×