The Evolution of Routing at Airbnb

The Airbnb app serves guests and hosts around the world, delivering magical travel experiences to guests and enabling businesses for hosts. In web applications, routing refers to the mechanism of converting a URL into a software component that can handle the specific path and query parameters. In the iOS app context, routing is a feature navigation API in a multiple module project. The presentation goes through the evolution of routing that happened in the last 14 months and dives into different implementations and their trade-offs.

Transcript

1. The Evolution of Routing at Airbnb AMIE KWEON • NOVEMBER 2019 • BA SWIFTABLE
2. The Evolution of Routing at Airbnb AGENDA Alternatives Routing v2 Routing v1 Pre Routing Airbnb App Routing on iOS First iteration July 2018 Second iteration March - July 2019 Trade-offs Lessons learned
3. The Evolution of Routing at Airbnb Alternatives Routing v2 Routing v1 Pre Routing Airbnb App Routing on iOS First iteration July 2018 Second iteration March - July 2019 Trade-offs Lessons learned AGENDA
4. The Evolution of Routing at Airbnb Alternatives Routing v2 Routing v1 Pre Routing Airbnb App Routing on iOS First iteration July 2018 Second iteration March - July 2019 Trade-offs Lessons learned AGENDA
5. The Evolution of Routing at Airbnb Alternatives Routing v2 Routing v1 Pre Routing Airbnb App Routing on iOS Airbnb App Routing on iOS Second iteration March - July 2019 Trade-offs Lessons learned AGENDA
6. The Evolution of Routing at Airbnb Alternatives Routing v2 Routing v1 Pre Routing Airbnb App Routing on iOS Airbnb App Routing on iOS Second iteration March - July 2019 Trade-offs Lessons learned AGENDA
7. Pre Routing
8. The Airbnb App https://www.airbnb.com/mobile
9. • Published in 2010 • Contributed by 400+ engineers • Over 1 million lines of code • 10,000+ source files • 300+ modules The Airbnb App STATS
10. Mechanism of converting a URL into a software component that can handle the specific path and query parameters Routing WEB CONTEXT
11. # Route definition in config/routes.rb Rails.application.routes.draw do resources :products, only: [:index, :show] end # Routing in a feature def share ... redirect_to product_url(@product) end Routing RAILS
12. // Route definition var express = require('express'); var app = express(); var products = require('./products'); app.get(‘/products’, products); // Routing in a feature function share(req, res, next) { ... return res.redirect(‘/products’); } Routing NODE.JS
13. Feature-to-feature Navigation
14. Product User Profile Product
15. class ProductViewController: UIViewController { func navigate(to hostID: UserID) { let viewController = UserViewController(userID: hostID) navigationController?.pushViewController( viewController, animated: true) } } Navigation on iOS PRODUCT TO USER PROFILE
16. class ProductViewController: UIViewController { func navigate(to hostID: UserID) { let viewController = UserViewController(userID: hostID) navigationController?.pushViewController( viewController, animated: true) } } Navigation on iOS PRODUCT TO USER PROFILE
17. Multi-Module Setup Product User Profile Registration Network Service Account Service Logging Service Dependencies Dependencies Dependencies App
18. Multi-Module Setup Product User Profile Registration Network Service Account Service Logging Service Dependencies Dependencies Dependencies App
19. import UserProfileFeature class ProductViewController: UIViewController { func navigate(to hostID: UserID) { let viewController = UserViewController(userID: hostID) navigationController?.pushViewController( viewController, animated: true) } } From Product To UserProfile
20. import ProductFeature class UserViewController: UIViewController { func navigate(to productID: ProductID) { let viewController = ProductViewController( productID: productID) navigationController?.pushViewController( viewController, animated: true) } } From UserProfile To Product
21. Circular dependency UserProfile Product
22. UserProfile Entrypoints ExperienceProduct HomeProduct HomeBooking Identity Activities HomeHost ExperienceBooking Reviews Stories Reservations Itinerary SafetyHub ExperienceHost
23. Build Order STRONG DEPENDENCY UserProfile ExperienceProduct HomeProduct ExperienceBooking Reservations Identity SafetyHub Stories HomeHost HomeBooking Itinerary Time
24. import UserProfileFeature class ProductViewController: UIViewController { func navigate(to hostID: UserID) { let viewController = UserViewController(userID: hostID) navigationController?.pushViewController( viewController, animated: true) } } From Product To UserProfile
25. class ProductViewController: UIViewController { init(userBuilder: (UserID) -> UIViewController) { … } func navigate(to hostID: UserID) { let viewController = userBuilder.build(hostID) navigationController?.pushViewController( viewController, animated: true) } } Workaround 1 BUILDER BLOCKS
26. class ProductViewController: UIViewController { init( userBuilder: (UserID) -> UIViewController, bookingBuilder: (ReservationID) -> UIViewController, contactHostBuilder: (ProductID) -> UIViewController, experienceBuilder: (ProductID) -> UIViewController) { … } } Workaround 1 BUILDER BLOCKS
27. class ProductViewController: UIViewController { func navigate(to hostID: UserID) { let command = UserProfileNavigationCommand( userID: hostID) command.execute(from: self) } } Workaround 2 COMMAND PATTERN
28. Feature navigation API in a multiple module environment Routing NATIVE CONTEXT
29. Routing v1 2018
30. • Navigate to another feature without importing its module • Establish a pattern for route definition and integration • Reduce code complexity for navigation logic Goals ROUTING V1
31. Protocol Composition ROUTING V1 Product UserProfile
32. Protocol Composition ROUTING V1 public protocol Product.OutboundRoutable { func routeToUser( id: String, from viewController: UIViewController) } public protocol UserProfile.InboundRoutable { func routeToUser( id: String, from viewController: UIViewController) } Product UserProfile
33. // in UserProfileFeature module public final class Router: UserProfile.Routable { func routeToUser( id: UserID, from presentingViewController: UIViewController) { // Construct UserProfileViewController // and display in the presenting view controller } } Module Router USER PROFILE ROUTER
34. extension AppRouter: UserProfile.Routable { func routeToUser( id: UserID, from presentingViewController: UIViewController) { userProfileRouter.routeToUser( id: id, from: presentingViewController) } } AppRouter
35. class ProductViewController: UIViewController { init(router: OutboundRoutable) { self.router = router } func navigate(to hostID: UserID) { router.routeToUser(id: hostID, from: self) } } From Product To UserProfile ROUTING V1
36. • Agnostic of feature architecture • Encourages iterative changes • Over 60 features adopted Adoption ROUTING V1
37. 1. Inconsistent implementations 2. Route methods are duplicated across many modules 3. All route methods are required 4. It requires too much code in the main target Problems ROUTING V1
38. Routing v2 2019
39. • Used in Android, Apple’s SiriKit, and Amazon’s Alexa • Routing characteristics: decoupling, composability, pre/post hooks (“interceptors “) Intents and Intent Handlers
40. • Lightweight module • Contains shared model and behavior definitions • Associated with feature modules and service modules • No business logic Interface Module
41. Modules ROUTING V2 UserProfile Product UserProfile Interface Product Interface
42. 1. A route is represented as a model 2. RouterService resolves a route and performs navigation 3. A route is registered with a route handler 4. A scope or feature can register route handlers 5. Interceptor defines a precondition Proposal ROUTING V2
43. 1. A route is represented as a model 2. RouterService resolves a route and performs navigation 3. A route is registered with a route handler 4. A scope or feature can register route handlers 5. Interceptor defines a precondition Proposal ROUTING V2
44. // in RouterServiceInterface public protocol Route {} Route Protocol #1 ROUTE MODEL
45. // in UserProfileFeatureInterface import RouterServiceInterface public struct UserProfileRoute: Route { public let userID: String public let user: User? } Route Definition #1 ROUTE MODEL
46. // in ProductFeature module import UserProfileFeatureInterface import RouterServiceInterface class ProductViewController: UIViewController { func navigate(to hostID: String) { let route = UserProfileRoute(userID: hostID) routerService.navigate(to: route, from: self) } } Route Consumer #1 ROUTE MODEL
47. 1. A route is represented as a model 2. RouterService resolves a route and performs navigation 3. A route is registered with a route handler 4. A scope or feature can register route handlers 5. Interceptor defines a precondition Proposal ROUTING V2
48. // in ProductFeature module import UserProfileFeatureInterface import RouterServiceInterface class ProductViewController: UIViewController { func navigate(to hostID: String) { let route = UserProfileRoute(userID: hostID) routerService.navigate(to: route, from: self) } } Route Consumer #2 ROUTER SERVICE
49. 1. A route is represented as a model 2. RouterService resolves a route and performs navigation 3. A route is registered with a route handler 4. A scope or feature can register route handlers 5. Interceptor defines a precondition Proposal ROUTING V2
50. // in RouterServiceInterface module public protocol RouteHandler { func destination(of route: RouteType) -> UIViewController func navigate( to route: RouteType, from presentingViewController: UIViewController, presentationStyle: ModalTransitions.Style?) } Route Handler #3 ROUTE HANDLER
51. 1. A route is represented as a model 2. RouterService resolves a route and performs navigation 3. A route is registered with a route handler 4. A scope or feature can register route handlers 5. Interceptor defines a precondition Proposal ROUTING V2
52. Dynamic Registry #4 REGISTRIES BY FEATURE App Scope Visitor Scope (Logged out) Guest Scope (Logged in) Host Scope
53. Dynamic Registry #4 REGISTRIES BY FEATURE App Scope Visitor Scope (Logged out) Guest Scope (Logged in) Host Scope
54. final class GuestTabBuilder: Builder<GuestTabDependencies> { func build() -> UIViewController { let scope = GuestTabScope( dependencies: dependencies) let viewController = GuestTabViewController( dependencies: dependencies) dependencies.routerService.register( scope.routeHandlerRegistries, ownedBy: viewController) return viewController } } Dynamic Registry #4 REGISTRIES BY FEATURE
55. 1. A route is represented as a model 2. RouterService resolves a route and performs navigation 3. A route is registered with a route handler 4. A scope or feature can register route handlers 5. Interceptor defines a precondition Proposal ROUTING V2
56. public class AuthRequiredInterceptor: RouteLifecycleInterceptor { public func execute( route: Route, lifecycle: NavigationLifecycle, from presentingViewController: UIViewController) { guard lifecycle == .started && route is AuthRequiredRoute && !accountManager.isLoggedIn else { return } let registrationRoute = RegistrationRoute() { [weak self] result in guard case .signIn = result else { return } self?.routerService.navigate( to: route, from: presentingViewController) } routerService.navigate( to: registrationRoute, from: presentingViewController) } } #5 INTERCEPTOR AuthRequired Interceptor
57. public class AuthRequiredInterceptor: RouteLifecycleInterceptor { public func execute( route: Route, lifecycle: NavigationLifecycle, from presentingViewController: UIViewController) { guard lifecycle == .started && route is RequiredAuthRoute && !accountManager.isLoggedIn else { return } let registrationRoute = RegistrationRoute() { [weak self] result in guard case .signIn = result else { return } self?.routerService.navigate( to: route, from: presentingViewController) } routerService.navigate( to: registrationRoute, from: presentingViewController) } } #5 INTERCEPTOR AuthRequired Interceptor
58. public class AuthRequiredInterceptor: RouteLifecycleInterceptor { public func execute( route: Route, lifecycle: NavigationLifecycle, from presentingViewController: UIViewController) { guard lifecycle == .started && route is RequiredAuthRoute && !accountManager.isLoggedIn else { return } let registrationRoute = RegistrationRoute() { [weak self] result in guard case .signIn = result else { return } self?.routerService.navigate( to: route, from: presentingViewController) } routerService.navigate( to: registrationRoute, from: presentingViewController) } } #5 INTERCEPTOR AuthRequired Interceptor
59. 1. A route is represented as a model 2. RouterService resolves a route and performs navigation 3. A route is registered with a route handler 4. A scope or feature can register route handlers 5. Interceptor defines a precondition Proposal ROUTING V2
60. Alternatives
61. • Translates well from web • Easy to implement • Difficult to represent complex routing parameter • Parsing strings to models can be error prone URL-based Routing let productURL = URL( string: “airbnb://d/product?id=\(productID)”) urlRouter.handle(productURL)
62. • Easy to discover route (e.g. Routes.userProfile) • Route precondition is abstracted as a plugin • Initiating a route requires a route identifier and route parameters. • Static route registry Central Routing Service routerService.routeTo( Routes.product.detail, parameters: ProductDetailNavigationParameter( presentingViewController: self, productID: id))
63. • Route models are extensible • Single source of truth • API is simple and consistent across features • Interceptors provide advanced customization • Adapts to user context Intents and Intent handlers
64. Code evolves You can’t make everyone happy Don’t forget developer productivity There’s no right solution Lessons Learned
65. amie.kweon@airbnb.com Thank you!