Toggle (pronounced tog-l) is the name of a type of switch that allows users to quickly hide or show content. It’s useful for hiding things like spoilers and article links, which would otherwise need to be removed by hand or through a complicated CMS process. Toggles work by obscuring the content until it’s clicked and then instantly showing it again. It is important to note that the toggle only affects content in the current view, and doesn’t impact article previews or other sections of the site. If you want to ensure that hidden content doesn’t disappear for readers of other articles, use subscriber group containers or hidden comments instead.

The word ‘toggle’ derives from the 18th century meaning “pin passed through the eye of a rope to fasten it.” Toggles are used in all sorts of applications, including computer technology, where they are often referred to as switches and are the basis for software shortcuts such as the Caps Lock key. In addition to the physical hardware, there are many other types of toggles used for functionality such as switching between applications and settings, which can be difficult in a web environment where navigation is typically limited to one or two screens.

Savvy teams look at the inventory of Feature Toggles as an asset that comes with a carrying cost and seek to keep it as low as possible. They’ll add a task to the backlog every time they introduce a new toggle and make it a priority to remove any toggle that is no longer necessary from the codebase. Some teams even go so far as to put ‘expiration dates’ on their toggles that will cause the system to fail (or refuse to start!) if the toggle is still present after its expiration date has passed.

When creating a new Toggle the team will first need to determine what it will enable/disable and how the user will navigate to that toggle state. This is where a lot of designers get stuck, as they struggle to think about how the toggle will actually be used in real life and what visual cues can be employed to make it as intuitive and easy to use as possible.

Once the toggle’s design is complete the team will need to test it out, which can be a challenge as they will need to verify that existing or legacy behavior is enabled when the toggle is flipped On and new or future behavior is enabled when the toggle is flipped Off. To overcome this obstacle many teams perform most of their testing with the toggle ‘on’ and only test the fallback configuration with the toggle ‘off’ to avoid any surprise regressions during a production rollout.

Another common issue arises when the initial configuration of a toggle is hardcoded into the codebase using a comment or preprocessor feature such as #ifdef, which doesn’t allow for dynamic re-configuration of the flag. When this happens it becomes increasingly difficult to test toggles effectively and can have a significant impact on the cycle times of the development process and the all-important feedback loop that CI/CD provides. To address this issue many teams choose to move their toggle configuration into some sort of centralized store, often an existing application DB and then build out a form of admin UI which makes it easy for developers, testers and product managers to manage and modify feature flags.