Introduction to Feature Toggles

Feature toggles

When we set up the continuous deployment pipeline, we encouraged you to:

Deploy early. Deploy often. Make it part of the culture!"

An automated deployment pipeline is one piece of the puzzle to make frequent deployments successful, not scary, and most importantly, to avoid major incidents in the end-user experience. We want to avoid at all costs the consistent downtime or a buggy experience for web application users.

What are feature toggles?

If you are not familiar with this term, maybe one of these sounds familiar:

• feature flag
• feature switch
• feature flipper
• conditional feature, etc.

In short,

It’s a mechanism to turn a feature on or off depending on certain conditions.

What these conditions are is really up to you. A few examples:

• A basic boolean value to control a feature’s visibility for all users. It’s either on or off for everyone.
• A percentage value. 10% of users see the new features, 90% do not.
• A date value. The feature is visible on weekdays from 9 to 5 but hidden overnight and on weekends.
• A user profile attribute to target individuals or groups of people, such as users who use the web application at least four times per week.

Depending on your situation, you may use other conditions that make sense in the context of what you are working on.

Besides individual conditions as described above, nothing stops us from combining conditions so that the new feature is only available to 5% of frequent users of the web app who previously provided feedback for a beta feature.

Feature toggles to release unfinished code

Our first use of feature toggles is to hide unfinished code, allowing us to deploy to production without fear of breaking anything unexpectedly.

The requirements for this work can be summarized as follows:

• Use Firebase Remote Config to store feature toggles.
• Use a Svelte store to store feature toggles on the client.
• Develop a Svelte component to deal with the potential complexity.

As we have not introduced the Svelte framework yet, Svelte is an open-source front end JavaScript framework. That’s all we need to know for now. We will explain it in detail in the upcoming chapters.

Now, let’s start working on the above-defined requirements one by one.