Why you should implement feature flipping in your project

Software Engineer ⢠TypeScript ⢠JavaScript ⢠Angular ⢠VueJS ⢠WordPress ⢠Ex-founder of ng-enious
Search for a command to run...

Software Engineer ⢠TypeScript ⢠JavaScript ⢠Angular ⢠VueJS ⢠WordPress ⢠Ex-founder of ng-enious
No comments yet. Be the first to comment.
Hello good people! In this short article, we're going to convert KML files to the GeoJSON format. The main takeaway aside from discovering something new is that I'll tell you about the popular solution, and then I'll show you the new solution I had t...

By the time I'm writing this article, you surely may have heard of ChatGPT. This "new AI" made so many waves that I couldn't resist digging through it and writing something about it. But rather than jumping into the hype train of ChatGPT and OpenAI, ...

Hello good people! In this article, we're going to create an npm package step by step. By the end of this article you will be able to: Build your own package Use it on other projects Publish it on npm [Bonus] Publish your TypeScript types with your ...

Hello good people! In this article, I want to shed light on a very interesting console function. It's called console.timer() and might help you understand how your code runs and optimize it. This will be a rather short article. We'll go through two s...

Hello good people! In this article, I want to deep dive with you into a usually overlooked file in a project. The package.json is crucial to a lot of frontend/backend NodeJS projects. Yet a lot of developers don't really know what it can really do. W...

Tarek's /dev/log
10 posts
Everyday blogs about software engineering, Frontend Web development and everything in between.
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.
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 :
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.
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?
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).
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 :
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 š.
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.