Features flags at BlaBlaCar

Features flags at BlaBlaCar

Talk given at ParisWeb 2016 with @odolbeau

0bd054e9a591ec3afb355f5c2c899a23?s=128

Benjamin De Bernardi

September 30, 2016
Tweet

Transcript

  1. ParisWeb 2016 - Feature flags @ BlaBlaCar @odolbeau & @genes0r

    Benjamin de Bernardi & Olivier Dolbeau Benjamin de Bernardi & Olivier Dolbeau Feature Flags at
  2. ParisWeb 2016 - Feature flags @ BlaBlaCar @odolbeau & @genes0r

    Benjamin De Bernardi Lead Engineer Since 2014 @genes0r
  3. ParisWeb 2016 - Feature flags @ BlaBlaCar @odolbeau & @genes0r

    Olivier Dolbeau Web architect Since 2012 @odolbeau
  4. ParisWeb 2016 - Feature flags @ BlaBlaCar @odolbeau & @genes0r

    100€ 25€ 25€ 25€ 100€ 25€
  5. ParisWeb 2016 - Feature flags @ BlaBlaCar @odolbeau & @genes0r

    15M 20M 10M 5M 1M 2015 2014 2013 2012 2011 2010 2009 25M members worldwide Over 35 million members and growing 1.5 million+ joining each month 35M 2016
  6. ParisWeb 2016 - Feature flags @ BlaBlaCar @odolbeau & @genes0r

    Agenda • Past ◦ BlaBlaTech ◦ Fail Learn Succeed • Now ◦ Why feature flags rocks? ◦ What about the implementation? • Future
  7. ParisWeb 2016 - Feature flags @ BlaBlaCar @odolbeau & @genes0r

    1
  8. ParisWeb 2016 - Feature flags @ BlaBlaCar @odolbeau & @genes0r

  9. ParisWeb 2016 - Feature flags @ BlaBlaCar @odolbeau & @genes0r

  10. ParisWeb 2016 - Feature flags @ BlaBlaCar @odolbeau & @genes0r

    Features & people 100+ people in the tech team. • Code • Test • Deliver (fast) AT THE SAME TIME!
  11. ParisWeb 2016 - Feature flags @ BlaBlaCar @odolbeau & @genes0r

  12. ParisWeb 2016 - Feature flags @ BlaBlaCar @odolbeau & @genes0r

    Angry developer
  13. ParisWeb 2016 - Feature flags @ BlaBlaCar @odolbeau & @genes0r

    Angry Product owner
  14. ParisWeb 2016 - Feature flags @ BlaBlaCar @odolbeau & @genes0r

    Medias
  15. ParisWeb 2016 - Feature flags @ BlaBlaCar @odolbeau & @genes0r

  16. ParisWeb 2016 - Feature flags @ BlaBlaCar @odolbeau & @genes0r

    Angry ops
  17. ParisWeb 2016 - Feature flags @ BlaBlaCar @odolbeau & @genes0r

  18. ParisWeb 2016 - Feature flags @ BlaBlaCar @odolbeau & @genes0r

    Deploying big features is too risky. It can’t be done for everyone at the same time anymore.
  19. ParisWeb 2016 - Feature flags @ BlaBlaCar @odolbeau & @genes0r

    Testing a feature with 25M users is not a solution. We need to be able to test a feature only in a country or for some users.
  20. ParisWeb 2016 - Feature flags @ BlaBlaCar @odolbeau & @genes0r

    The “Capital effect” must not happen anymore. We need to find a solution to maintain the website up even when the traffic is high.
  21. ParisWeb 2016 - Feature flags @ BlaBlaCar @odolbeau & @genes0r

  22. ParisWeb 2016 - Feature flags @ BlaBlaCar @odolbeau & @genes0r

    Feature flags Feature flags Feature flags Feature flags Feature flags
  23. ParisWeb 2016 - Feature flags @ BlaBlaCar @odolbeau & @genes0r

    A 'Feature Flag' (or Feature Toggle) is the ability to turn features (sub-sections) of your application on/off at a moments notice. Wikipedia
  24. ParisWeb 2016 - Feature flags @ BlaBlaCar @odolbeau & @genes0r

    2
  25. ParisWeb 2016 - Feature flags @ BlaBlaCar @odolbeau & @genes0r

    Tech & product guys are happy!
  26. ParisWeb 2016 - Feature flags @ BlaBlaCar @odolbeau & @genes0r

    Activate a feature
  27. ParisWeb 2016 - Feature flags @ BlaBlaCar @odolbeau & @genes0r

    Slowly rollout a new feature
  28. ParisWeb 2016 - Feature flags @ BlaBlaCar @odolbeau & @genes0r

    Angry ops.
  29. ParisWeb 2016 - Feature flags @ BlaBlaCar @odolbeau & @genes0r

    Deactivate a feature in production
  30. ParisWeb 2016 - Feature flags @ BlaBlaCar @odolbeau & @genes0r

    Implementation
  31. ParisWeb 2016 - Feature flags @ BlaBlaCar @odolbeau & @genes0r

    Device agnostic
  32. ParisWeb 2016 - Feature flags @ BlaBlaCar @odolbeau & @genes0r

    No deployment
  33. ParisWeb 2016 - Feature flags @ BlaBlaCar @odolbeau & @genes0r

  34. ParisWeb 2016 - Feature flags @ BlaBlaCar @odolbeau & @genes0r

    What do we need? • a storage to store all feature flags and their rules • an admin interface to create / update / delete feature flags • a PHP library to use in our application
  35. ParisWeb 2016 - Feature flags @ BlaBlaCar @odolbeau & @genes0r

    Existing solutions • etsy / features • joshuaestes / feature-toggle • opensoft / rollout • qandidate / toggle
  36. ParisWeb 2016 - Feature flags @ BlaBlaCar @odolbeau & @genes0r

    Existing solutions • etsy / features • joshuaestes / feature-toggle • opensoft / rollout • qandidate / toggle deprecated
  37. ParisWeb 2016 - Feature flags @ BlaBlaCar @odolbeau & @genes0r

    Existing solutions • etsy / features • joshuaestes / feature-toggle • opensoft / rollout • qandidate / toggle deprecated no storage logic
  38. ParisWeb 2016 - Feature flags @ BlaBlaCar @odolbeau & @genes0r

    Existing solutions • etsy / features • joshuaestes / feature-toggle • opensoft / rollout • qandidate / toggle deprecated no storage logic Good choice!
  39. ParisWeb 2016 - Feature flags @ BlaBlaCar @odolbeau & @genes0r

    Existing solutions • etsy / features • joshuaestes / feature-toggle • opensoft / rollout • qandidate / toggle deprecated no storage logic Good choice! Even better!
  40. ParisWeb 2016 - Feature flags @ BlaBlaCar @odolbeau & @genes0r

    http://labs.qandidate.com/blog/2014/08/18 /a-new-feature-toggling-library-for-php/
  41. ParisWeb 2016 - Feature flags @ BlaBlaCar @odolbeau & @genes0r

    Meet Qandidate\Toggle
  42. ParisWeb 2016 - Feature flags @ BlaBlaCar @odolbeau & @genes0r

    Checking values: operators
  43. ParisWeb 2016 - Feature flags @ BlaBlaCar @odolbeau & @genes0r

    Context
  44. ParisWeb 2016 - Feature flags @ BlaBlaCar @odolbeau & @genes0r

    Putting it all together
  45. ParisWeb 2016 - Feature flags @ BlaBlaCar @odolbeau & @genes0r

  46. ParisWeb 2016 - Feature flags @ BlaBlaCar @odolbeau & @genes0r

    http://labs.qandidate.com/blog/2014/08/19/ open-sourcing-our-feature-toggle-api-and-ui/ API UI
  47. ParisWeb 2016 - Feature flags @ BlaBlaCar @odolbeau & @genes0r

    How it works for us?
  48. ParisWeb 2016 - Feature flags @ BlaBlaCar @odolbeau & @genes0r

    What will we explain? Storages Strategies Operators & Context Devices Administration
  49. ParisWeb 2016 - Feature flags @ BlaBlaCar @odolbeau & @genes0r

    Storages
  50. ParisWeb 2016 - Feature flags @ BlaBlaCar @odolbeau & @genes0r

    Storages APCu Our own implementations.
  51. ParisWeb 2016 - Feature flags @ BlaBlaCar @odolbeau & @genes0r

    • Primary data store • 1 key containing all toggles • 1 key / toggle containing its configuration (encoded JSON)
  52. ParisWeb 2016 - Feature flags @ BlaBlaCar @odolbeau & @genes0r

    • Cache layer (60 seconds) • Encapsulation FTW • Encoded JSON APCu
  53. ParisWeb 2016 - Feature flags @ BlaBlaCar @odolbeau & @genes0r

    Strategies
  54. ParisWeb 2016 - Feature flags @ BlaBlaCar @odolbeau & @genes0r

    Strategies
  55. ParisWeb 2016 - Feature flags @ BlaBlaCar @odolbeau & @genes0r

    Operators
  56. ParisWeb 2016 - Feature flags @ BlaBlaCar @odolbeau & @genes0r

    >= >= LessThan LessThanEqual MatchesRegex Percentage Available operators EqualsTo GreaterThan GreaterThanEqual InSet = [...] < %% % >
  57. ParisWeb 2016 - Feature flags @ BlaBlaCar @odolbeau & @genes0r

  58. ParisWeb 2016 - Feature flags @ BlaBlaCar @odolbeau & @genes0r

    Implementation
  59. ParisWeb 2016 - Feature flags @ BlaBlaCar @odolbeau & @genes0r

    Implementation - Context
  60. ParisWeb 2016 - Feature flags @ BlaBlaCar @odolbeau & @genes0r

    Implementation - Context Mainly focused on the user.
  61. ParisWeb 2016 - Feature flags @ BlaBlaCar @odolbeau & @genes0r

    Implementation - Context Can be website centric.
  62. ParisWeb 2016 - Feature flags @ BlaBlaCar @odolbeau & @genes0r

    Can also be feature centric. Implementation - Context
  63. ParisWeb 2016 - Feature flags @ BlaBlaCar @odolbeau & @genes0r

    Implementation - Manager
  64. ParisWeb 2016 - Feature flags @ BlaBlaCar @odolbeau & @genes0r

    Implementation - Views
  65. ParisWeb 2016 - Feature flags @ BlaBlaCar @odolbeau & @genes0r

    Implementation - Views
  66. ParisWeb 2016 - Feature flags @ BlaBlaCar @odolbeau & @genes0r

    Devices Devices
  67. ParisWeb 2016 - Feature flags @ BlaBlaCar @odolbeau & @genes0r

    Mobile apps API Flags Native flags
  68. ParisWeb 2016 - Feature flags @ BlaBlaCar @odolbeau & @genes0r

    Internal Flags Export JSON Get JSON
  69. ParisWeb 2016 - Feature flags @ BlaBlaCar @odolbeau & @genes0r

    Internal Flags
  70. ParisWeb 2016 - Feature flags @ BlaBlaCar @odolbeau & @genes0r

    Name Internal Flags
  71. ParisWeb 2016 - Feature flags @ BlaBlaCar @odolbeau & @genes0r

    Strategy Internal Flags
  72. ParisWeb 2016 - Feature flags @ BlaBlaCar @odolbeau & @genes0r

    Conditions Internal Flags
  73. ParisWeb 2016 - Feature flags @ BlaBlaCar @odolbeau & @genes0r

    Context key Internal Flags
  74. ParisWeb 2016 - Feature flags @ BlaBlaCar @odolbeau & @genes0r

    Flaggr Open Source Android : blablacar/flaggr-android iOS : blablacar/flaggr-ios (soon)
  75. ParisWeb 2016 - Feature flags @ BlaBlaCar @odolbeau & @genes0r

  76. ParisWeb 2016 - Feature flags @ BlaBlaCar @odolbeau & @genes0r

  77. ParisWeb 2016 - Feature flags @ BlaBlaCar @odolbeau & @genes0r

    We have 100+ toggles.
  78. ParisWeb 2016 - Feature flags @ BlaBlaCar @odolbeau & @genes0r

    We can define toggles / devices
  79. ParisWeb 2016 - Feature flags @ BlaBlaCar @odolbeau & @genes0r

    Name Strategy Conditions summary Actions
  80. ParisWeb 2016 - Feature flags @ BlaBlaCar @odolbeau & @genes0r

    Basic settings 1. User id 2. Website locale 3. User percentage 4. User phone extension 5. Currency
  81. ParisWeb 2016 - Feature flags @ BlaBlaCar @odolbeau & @genes0r

  82. ParisWeb 2016 - Feature flags @ BlaBlaCar @odolbeau & @genes0r

    Example
  83. ParisWeb 2016 - Feature flags @ BlaBlaCar @odolbeau & @genes0r

  84. ParisWeb 2016 - Feature flags @ BlaBlaCar @odolbeau & @genes0r

  85. ParisWeb 2016 - Feature flags @ BlaBlaCar @odolbeau & @genes0r

    Rules 1. Displayed in France only a. Will be activated for other countries later (BE, PL, NL) 2. Two kinds of results a. Beginners only b. Cheapest rides 3. Only for logged users 4. Activate for 50% of the users to control the impact
  86. ParisWeb 2016 - Feature flags @ BlaBlaCar @odolbeau & @genes0r

    Flag
  87. ParisWeb 2016 - Feature flags @ BlaBlaCar @odolbeau & @genes0r

    Implementation
  88. ParisWeb 2016 - Feature flags @ BlaBlaCar @odolbeau & @genes0r

  89. ParisWeb 2016 - Feature flags @ BlaBlaCar @odolbeau & @genes0r

  90. ParisWeb 2016 - Feature flags @ BlaBlaCar @odolbeau & @genes0r

    Geo based conditions • Axis between cities • GeoJSON inside ElasticSearch
  91. ParisWeb 2016 - Feature flags @ BlaBlaCar @odolbeau & @genes0r

    Features activation & A/B test Partnership with on Paris - Lyon Partnership with on Paris - Nancy Geo based conditions
  92. ParisWeb 2016 - Feature flags @ BlaBlaCar @odolbeau & @genes0r

    Internal A/B test tool.
  93. ParisWeb 2016 - Feature flags @ BlaBlaCar @odolbeau & @genes0r

    Internal A/B test tool. Why ? • External tools are JavaScript based (GTM & Optimizely) • Upgrades upon need
  94. ParisWeb 2016 - Feature flags @ BlaBlaCar @odolbeau & @genes0r

    Internal A/B test tool. New settings • User grade
  95. ParisWeb 2016 - Feature flags @ BlaBlaCar @odolbeau & @genes0r

    Internal A/B test tool. New settings • Visitor group ◦ Cookie set by Nginx ◦ 18 groups
  96. ParisWeb 2016 - Feature flags @ BlaBlaCar @odolbeau & @genes0r

    3
  97. ParisWeb 2016 - Feature flags @ BlaBlaCar @odolbeau & @genes0r

  98. ParisWeb 2016 - Feature flags @ BlaBlaCar @odolbeau & @genes0r

    To improve • Feature flag removal • Deal with permissions - In progress • Use a flag for “old” features • Naming!
  99. ParisWeb 2016 - Feature flags @ BlaBlaCar @odolbeau & @genes0r

  100. ParisWeb 2016 - Feature flags @ BlaBlaCar @odolbeau & @genes0r

  101. ParisWeb 2016 - Feature flags @ BlaBlaCar @odolbeau & @genes0r

    Feature flags?
  102. ParisWeb 2016 - Feature flags @ BlaBlaCar @odolbeau & @genes0r

    Yes.
  103. ParisWeb 2016 - Feature flags @ BlaBlaCar @odolbeau & @genes0r

    Questions?
  104. ParisWeb 2016 - Feature flags @ BlaBlaCar @odolbeau & @genes0r

    Thank you BlaBlaCar is hiring !