Why you should implement feature flipping in your project

Listen to this article

Hello good people! Did you ever hear about feature flipping? No? Maybe feature flags? Feature switches? Well have no fear, lots of developers are like you. (Actually, I was like you too so no worries.) I will try to share with you all what I've learned about this name-shifting concept and why you should implement feature flipping in your current project.

But what is this feature flipping thing? ๐ŸŽ›

If you check the feature flipping Wikipedia page you'll maybe understand that this it's a ยซ software technique that is an alternative to branches in source code. ยป This definition confuses the hell out of me. Other websites/articles will tell you that it's a pattern or a set of patterns. In any case, I don't like this definition so let's define it my way. I still invite you to research the topic and draw your own conclusions, it's better!

Suppose you have a blog, let's simplify the user's roles :

  • Visitors can read articles and comment them.
  • Writers can write/review comments and write articles.
  • Admins can write/review comments, write articles and manage users.

So far this looks like a privilege system. Now look at each action as a feature. The more you are privileged, the more you have features available. Now let's push the concept further. The Admin being bored of managing the users he flips the feature to let writers manage users on their own.

Feature flipping is about features more than code ๐Ÿงพ

When I talk about feature flipping, I think about controlling the user's experience in a software. For example, writing a cheat code that makes you invincible in a game is in a way a feature flip. Letting the user choose dark mode is a feature flip and so on. Saying that it's an alternative to branches in source code seems kind of confusing. If my feature exists in a branch, it will only be visible for me in that said branch and when I will merge it.

Feature flipping can be as simple as a checkbox that the user ticks in a hidden interface. An option in the settings page. A value in a config file that the server sends to the frontend app. You'll have to be creative about this. But you might now wonder, why bother?

What's the use of feature switches? ๐Ÿšข

Suppose you're shipping a new feature in your app. You deploy your new version but quickly realize that there's a bug plaguing it. You'll have to either rollback your release, quickly change your code to hide the said feature or something. Well with feature flipping, you just need to tell the app to disable the feature, neat! But there's more! If you nail your privilege system, you can even roll your feature to a select number of users and see if it's working correctly. This is a very popular technique that Facebook and Google uses all the time.

Let's imagine that your feature needs a lot of server resources (for example a video calling feature that uses the server as the middle-man in the communication). Why not make it as a feature switch and try it on 10% of your 1 million users ? 100k users will be able to test your new feature (though it's more complicated that this but just assume). You notice that your servers are suffering to handle the traffic. This will give you more insight about how you should handle things (either find out why and fix it, add more servers capacity or anything else).

When not to use feature flipping? โŒ

I can't stress enough that you should learn about feature toggles and implement them even on the smallest scale. For example my first feature switch was a special debug mode that added more buttons and enabled extensive console logging on the browser. But in some cases, feature flipping can be problematic :

  • More time to ship your work since sometimes you have to think ahead of the problem.
  • Potential dead code hanging around (especially checking for if the feature is enabled or not for example).
  • Users unhappy about features appearing and disappearing etc...

How to implement feature flipping? โš™๏ธ

Right now I'm working on a VueJS project, I'm using the excellent vue-feature-flipping plugin. Before bootstrapping the app I make a fetch call to get the list of enabled features then store them and manage them using the plugin. For Angular, I've worked on a custom directive on my previous project, but if you're looing for a ready-to-use dependency, try ngx-feature-toggle that looks excellent. If you're more a ReactJS guy, flipflop looks like the perfect candidate and it's very well active so just try it.

One important recommendation, prefer sending a list of the enabled features (or store them in an accessible JSON file for example) rather than the list of all the features enabled and disabled. This avoids you the hassle of few hacky users to force enable features ๐Ÿ˜.

Wrap-up ๐Ÿ“ฆ

Feature flipping is a very powerful tool, I really recommend you to try it. It will make you think your code and features in a different way and save all the time a big hassle when you ship some buggy feature. If your team does not want to implement feature switches, start small on your side with some hidden features (or share with them this article haha) and show them how your feature toggles are making your work easier like for example a developer mode feature switch or something.

Finally, thank you for taking some time to read this. If you want to interact, you know what to do. If I've missed something or made a mistake, please let me know. Keep on coding!

Further reading:

Photo by Sting Alleman on Unsplash.

No Comments Yet