Kod içindeki bayraklar

Site kodunuza deneysel değişiklikleri tanımlayan özel bayraklar ekleyin. Sitenin herhangi bir öğesi için kullanılabilirler. Bayrak bir “anahtar-değer” çiftini temsil eder. Örneğin, deneme yapmak için düğmenin rengini belirleyebilirsiniz: color=red.

Bayraklar, ne kadar karmaşık olursa olsun değişiklikleri uygulamak ve test etmek için uygundur. Örneğin, sadece site veya uygulamanın görünen nesnelerini (düğme rengi vb.) değiştirmekle kalmayıp aynı zamanda çalışma mantığını da değiştirebilirsiniz. Böylece, bayrakları hem istemci tarafında hem de sunucu tarafında kullanabilirsiniz.

Bu yöntemi uygulamak için geliştirici, yeni bir işlevsellik sağlayan kodu yazmalıdır. Bir deney yaparken, işlevsellik uygulanabilmesi için “anahtar-değer” çiftini belirtmeniz gerekir.

Örneğin, ürüne yeni bir yön eklemek istiyorsunuz. Bu durumda geliştirici sunucu tarafında yeni bir işlevsellik uyguluyor ve gerekli bayrakları ekliyor. Ardından A/B testi ayarlarında şu kuralı belirleyin: Bayrak açıksa yeni mantık, kapalıysa eski mantık çalışır.

Bu tür bir deneyde veri işleme aşağıdaki gibidir. Bayraklarla ilgili verileri alabileceğiniz an, sitenizin bilgileri nasıl işlediğine bağlıdır:

Client-Side Rendering

Bayraklar sayfa kodu işlendikten sonra, ancak UI oluşturulmadan önce alınabilir. Ayrıca asenkron bayrak sorgusu kullanabilir ve değeri aldıktan sonra düğmenin rengi değiştirilebilir. Bu durumda ziyaretçi, bayrak değeri uygulandığı anda sayfanın kaynak kodunu görebilir.

Server-Side Rendering

Bayraklar yanıt üretilirken alınabilir. Varioqub sitenizi yavaşlatmayacak kadar hızlıdır. Bu durumda aktarılacak olanlar:

  • açık olarak ziyaretçinin tanımlayıcısını ve yeni bir tanımlayıcı alındığında (bayraklarla birlikte) bunu HTTP yanıtına kurmak,

  • ön uçtaki Yandex Metrica sayacı için teknik veriler ve onları sayacın ilgili alanına kurmak, ayrıntılar için API usersplit bölümüne bakın.

Kullanım örnekleri
  • Ürüne yeni bir yön vermek istiyorsunuz, örneğin bir bankada kredi kartı lansmanı yapmak gibi.

    Bayrakların yardımıyla değişiklikleri kademeli olarak uygulayabilirsiniz: bir işlev ekleyin, test edin ve yeniliğin etkili olduğu görülürse bunu tüm ürüne uygulayın.

  • Çiçekçi dükkanları zincirine yeni bir şube katıldı. Yeni müşteriler için kişiselleştirilmiş bir teklifin dönüşüm oranlarını nasıl etkileyeceğini anlamak istiyorsunuz.

    Bunu yapmak için, seçilen kitleye kişiselleştirilmiş bir indirimin verileceği bir özellik atayabilirsiniz.

Deney oluşturma örneği

Bayrakları kullanarak, özel teklif koşullarını içeren banner görselinin değiştirilmesi deneyini nasıl gerçekleştirebileceğimizi inceleyelim.

  1. Sayfanın HTML kodunda, deney sırasında değiştirilecek banner görseline bir ID atayın, örneğin: <img class="img" src="images/action.png" id="testImage"/>, bu durumda: testImage.

  2. Sayfa koduna, deneydeki bayrak değerine göre görseli değiştirecek bir script ekleyin. Örneğin:

<script type="text/javascript">
    const imageID = "testImage";
    // değiştirilecek öğenin ID'si
        ymab(
        // veri aktarmak için kullanılabilen fonksiyon
            'metrika.XXXXXXXXXXX',
            // XXXXXXXXXXX — Yandex Metrica sayaç numaranız
            'getFlags',
            // deneyi başlatan
            // ve bayrakları döndüren fonksiyon metodu
            function (flags) {
            // banner görselini değiştirecek fonksiyon
                const values = flags.test_image;
                // test_image, deney ayarlarındaki anahtar
                if (values) {
                    if ("new_banner" === values[values.length - 1]) { 
                        // new_banner, deneydeki anahtarın değeri
                        // son deney
                        // sırasında elde edilen son değerle karşılaştırılır
                        document.getElementById(imageID).src = "static/src/new_action.png";
                        // deneyden
                        // bayrak değerini aldıysak görseli değiştirir
                        }
                    }
                }
            );
</script>
  1. Yeni bir deney oluşturun.

    • Deney ayarları alanlarını doldurun. Ayrıntılı ayarlar: Deney oluşturma.
    • Deney türü olarak Bayraklar seçeneğini belirleyin.
  2. Deney seçeneği alanlarına şunları girin:

    • Key: test_image.
    • Value: new_banner.

  3. Seçilen test süresi ve hedef kitle oranıyla deneyin istatistiksel olarak anlamlı bir sonuç verip vermeyeceğini Ayar Hesaplayıcısı'nı kullanarak kontrol edin. Gerekirse ayarları düzenleyin. Ayrıntılı: Ayar Hesaplayıcısı.

  4. Eğer başlatmak için her şey hazırsa, Kaydet ve başlat’a tıklayın. Deney Deneyler sayfasında görünecek. Başlatma tarihi geldiğinde otomatik olarak başlatılacak.


Birkaç deney seçeneğini kontrol etmeniz gerekiyorsa, Seçenek ekle’ye tıklayın. Ayar için başka bir deneysel seçenek oluşacaktır. Seçenekler deney sırasında birbirinin yerini alacaklar.

Kontrol seçeneği için bayrakların belirtilmesi gerekli değildir.

Seçeneğe başka bir bayrak eklemek için Bayrak Ekle öğesine tıklayın.

GitHub’da bayrakları kullanarak bağlama ve deney oluşturma örneklerine bakın:

Sorular ve sorunlar

Bir deney oluştururken tüm alanlar kilitlenmiştir.

Varioqub arayüzünde gerekli koşullar mevcut değilse ne olur?

Destek Ekibi'ne yaz