Hey folks. We have VWO set up to run A/B tests across our site, and so far it's been integrating fine with Next.js. However, recently we ran a pretty sizeable test on the homepage where we had three design variants, as well as the Control design. This meant I had something like this:

<Control />
<Variant1 />
<Variant2 />
<Variant3 />

In these components they were wrapped with a hidden class and then revealed depending on which variant we wanted them to see via VWO.

Our bandwidth bill almost doubled because each page load was loading in every component, even if they were hidden. Because of above-the-fold content loading, we needed to have each component ready to display so we could avoid content flashing and all of that, which meant (I think) we couldn't use next/dynamic.

I don't really know what the best play is here, in order to have multiple variants like this but not load unnecessary code for every visitor who doesn't need it.

Does anyone here have experience using a service like VWO for A/B testing? Code-only A/B libraries are not in the cards, because we need non-developers to be able to spin up tests.