Percentage Rollout
Visualize how percentage rollouts affect 900 simulated users
Performance Monitor
0 ops0ms avg⌄
Rollout Visualization
900 users in a 30x30 grid showing rollout distribution
This demo uses the FlagVault SDK with user context and cache disabled for real-time rollout behavior. Each user gets consistent results based on their ID.
Total Users
900
Enabled Users
0
Percentage
0.00%
Disabled Users
900
Each dot represents a user
Enabled
Disabled
How Rollouts Work
Understanding the consistent hashing algorithm
Consistent Distribution
- •Each user ID is hashed with the flag key and rollout seed
- •Hash result determines if user is in rollout percentage
- •Same user always gets same result (deterministic)
- •Distribution is evenly spread across user base
Rollout Benefits
- •Gradual feature release reduces risk
- •Monitor performance impact with small groups
- •Easy to increase percentage over time
- •Instant rollback if issues are detected
Implementation Examples
Code examples for percentage rollouts
Basic Percentage Rollout
// Percentage rollout with user context
const userId = user.id; // Unique identifier for the user
const hasNewFeature = await sdk.isEnabled(
'new-checkout-flow',
false,
userId // User context for consistent rollout
);
if (hasNewFeature) {
// User gets the new feature
return <NewCheckoutFlow />;
} else {
// User gets the old feature
return <OldCheckoutFlow />;
}Consistent User Experience
// Same user always gets same result
const userId = "user-123";
// This will always return the same result for user-123
// Based on the flag's rollout percentage and seed
const result1 = await sdk.isEnabled('feature', false, userId);
const result2 = await sdk.isEnabled('feature', false, userId);
// result1 === result2 (always true)
// Different users get different results based on hash
const userA = await sdk.isEnabled('feature', false, 'user-a');
const userB = await sdk.isEnabled('feature', false, 'user-b');
// userA and userB may be differentRollout Strategy
Best practices for percentage rollouts
- 1Start Small: Begin with 1-5% of users to validate the feature
- 2Monitor Metrics: Watch performance, errors, and user feedback
- 3Gradual Increase: Expand to 10%, 25%, 50%, 75%, 100% over time
- 4Quick Rollback: Reduce percentage immediately if issues arise
- 5Full Release: Set to 100% when confident, then remove flag