I’m trying to A/B test a component on nextjs but the problem I’m facing is that the expiration time of cookies are too long and there seem to be no way to purge them for all users.
I want to do progressive roll-out meaning that to slowly release a feature to the public so my A/B test will start with:
Variation A (default): 90%
Variation B: 10%
Then:
Variation A (default): 90%
Variation B: 10%
so on and so forth till 100%, but according to the article here:
Understanding Builder Cookies - Duration and Expiration it takes 30 days for variation cookies to expire and that causes my test to get stuck as it always returns the old variation even tho I have selected a different variation as a winner.
Also, blocks me from progressive roll-outs as if a user is assigned a variation it does not update for them until a very long time.
Hello @muhammadjunaid,
Managing cookie expiration and performing progressive rollouts for A/B testing in Builder.io can be challenging due to the default cookie behavior. However, there are several ways to address this issue:
- Edge Middleware for Personalization and Testing: Implementing edge middleware in your Next.js application can help deliver personalized experiences without significant performance penalties. By rewriting requests at the edge based on visitor attributes stored in cookies, you can dynamically deliver different variations of content to users.
-
Incremental Static Regeneration (ISR): This feature in Next.js allows you to serve pre-rendered static content and instantly update it as visitors interact with your website. By leveraging ISR, you can ensure that the most recent content variation is served to users without waiting for cookie expiration.
-
Using builder.tests.{builderId}
Cookie: This cookie stores the variation key for the selected A/B test variant, which helps in determining which variation to serve to a user. It’s crucial for tracking which version of a variant users are seeing.
-
Server-Side Rendering and Edge Caching: To ensure fast load times and dynamic content delivery, using server-side rendering (SSR) combined with edge caching can be beneficial. This allows you to make real-time decisions at the server level about which variant to deliver based on current user metrics and attributes.
Let us know if you have any further questions.
Thanks,