App Architectures: Remixed (iOSCon 2018 edition)

App Architectures: Remixed (iOSCon 2018 edition)

Many apps support "theming", but some must flexibly support different customers with remixed flows and feature sets while reusing as much as possible.

Separating apps into composable layout, flow, and logic components makes this possible, and also unlocks superpowers like fantastically stable subsecond UX flow testing (goodbye simulator!)

Dan Cutting guides us through the collection of "Remix" architectural patterns his team have been applying to make this possible on a suite of apps designed for millions of users.

94fc7b58c03a0650fe1e8d78140bd451?s=128

Dan Cutting

March 23, 2018
Tweet

Transcript

  1. ed App Architectures @dcutting cutting.io Dan Cutting Schibsted

  2. None
  3. None
  4. None
  5. ¯\_(ツ)_/¯

  6. Marketplaces

  7. None
  8. 2015 2016 mid-2017 late-2017 Developers 0 3 6 9 12

    Timeline
  9. –Uncle Bob “The goal of software architecture is to minimize

    the human resources required to build and maintain the required system” Clean Architecture
  10. MVC

  11. MVC MVVM VIPER

  12. MVC MVVM VIPER

  13. Our app

  14. Our app context • many markets • remixable features •

    remote teams • frequent releases
  15. Our app context • many markets • remixable features •

    remote teams • frequent releases ?
  16. break it down build it up

  17. Ad List VC Ad Detail VC Happy Buyer Team make

    browsing ads fun
  18. Ad Detail VC Ad Edit VC Ad List VC Glorious

    Seller Team Edit Gateway make selling stuff easy
  19. Ad Detail VC Ad Edit VC Ad List VC Browse

    Flow Flow coordinators Edit Gateway
  20. Belarus App Browse Flow Ad Detail VC Ad List VC

    Custom views
  21. Browse Flow Ad Detail VC Ad Cards VC Custom views

    Mexico App
  22. “software components should be as small as possible but no

    smaller - Einstein?
  23. test (1, 2)

  24. End-to-end (E2E)

  25. Experience the app
 just like a real user ✔ End-to-end

    (E2E)
  26. 1. Slow, vague

  27. 1. Slow, vague ✗

  28. 1. Slow, vague ? ✗

  29. 1. Slow, vague ? ? ✗

  30. 1. Slow, vague ? ? ? ? ? ? ?

    ? ? ? ? ✗
  31. 2. Insufficient

  32. 2. Insufficient ✗

  33. E2E, huh! good god What is it good for?

  34. E2E, huh! good god What is it good for? •

    Quality Assurance (QA)?
  35. E2E, huh! good god What is it good for? •

    Quality Assurance (QA)? • Not good for baking in quality
  36. E2E, huh! good god What is it good for? •

    Quality Assurance (QA)? • Not good for baking in quality • Not good for assuring the product
  37. E2E, huh! good god What is it good for? •

    Quality Assurance (QA)? • Not good for baking in quality • Not good for assuring the product • OK for smoke tests
  38. E2E

  39. E2E Unit Tests

  40. Acceptance E2E Unit Tests

  41. None
  42. None
  43. 100% of app User Web

  44. UIKit views/controllers Network gateway User Web 99% of app

  45. UIKit views/controllers Spies Network gateway Stubs 99% of app

  46. UIKit views/controllers Spies Network gateway Stubs 99% of app Acceptance

    tests & fixtures
  47. View Controller Humble views

  48. View View Controller View Data Humble views

  49. View View Controller View Data Humble views

  50. View View Controller View Data Humble views

  51. View View Controller View Data View Spy Humble views

  52. View View Controller View Data View Spy Humble views (+

    gateways)
  53. App Delegate Browse Flow Gateway List VC Detail VC Business

    logic Spies Stubs 99% of app
  54. Browse Flow Gateway Stub List Spy Detail Spy Business logic

    Spies Stubs 99% of app App Delegate
  55. Fixture Browse Flow Gateway Stub List Spy Detail Spy Business

    logic Spies Stubs 99% of app
  56. Fixture Browse Flow Gateway Stub List Spy Detail Spy UINavController

    UI flow Spies Stubs Business logic Business logic
  57. UINavController Fixture Browse Flow Gateway Stub List Spy Detail Spy

    Navigator Fake UI flow Spies Stubs Business logic Business logic
  58. UINavController Fixture Browse Flow Gateway Stub List Spy Detail Spy

    Navigator Fake No more UIKit! UI flow Spies Stubs Business logic Business logic
  59. Loading Sirius
 Canopus
 Arcturus Could not
 load star < Sirius

    < Brightest star
 in the sky
  60. Loading Sirius
 Canopus
 Arcturus Could not
 load star < Sirius

    < Brightest star
 in the sky Demo
  61. break it down build it up

  62. ed App Architectures github.com/dcutting/Remix @dcutting cutting.io Dan Cutting Schibsted /paulstringer/OCSlimProject