Blog

Universal Analytics’te Sayfa Yükleme Süresi

Google Analytics’te, site hızınızı izleyebilir ve hangi sayfaların site hızına olumlu ve olumsuz yönde katkıda bulunduğunu iyi bir şekilde görebilirsiniz. Sayfa yükleme süresi metriğindeki sorun, bir örneğe dayanan ortalama olmasıdır. Örnek hızını setSiteSpeedSampleRate () ile değiştirebilirsiniz , ancak bu benim için yeterince iyi değil .

GÜNCELLEME 28.3.2014 : Bu yayın hala geçerlidir, ancak Kullanıcı Zamanlamalarına sahip bir uygulama, gerçek sayfa yükleme süresini ölçmek için çok daha akıllı bir yoldur. Yakın gelecekte bir noktada kısa bir güncelleme yapacağım.)

Dolayısıyla bu yazımda Universal Analytics ve Google Etiket Yöneticisi olan güzel kombinasyonu keşfetmeye devam ediyorum. Hava durumunu özel bir boyut olarak göndermek için Universal Analytics’i kullanma hakkındaki önceki yazımı kontrol ettiğinizden emin olun .

Sonuç

Bu ne olsun:

Gördüğünüz, her sayfa görünümüyle birlikte gönderilen ve sayfanın yüklenmesinin ne kadar sürdüğünü anlatan bir etkinlik. Olayları kullanmamın nedeni, özel boyutlar değil, sadece kolaylık. Olaylarla birlikte, güzel bir standrad rapor kümem var, bu da özel raporlarla uğraşmama gerek olmadığı anlamına geliyor.

Özel bir ölçüm olarak mutlak değerleri (milisaniye cinsinden) kullanmak isterdim, ancak sorun, özel ölçümlerle hesaplayamamanızdır, bu nedenle çok önemli ortalamaları kaydetmek imkansız olurdu. Bu yüzden milisaniyeyi sayfa yükleme zamanına yaklaşan bir dizgeye dönüştürme şemasını seçtim.

YASAL UYARI : Google Analytics site hızında olduğu gibi, bu işlem yalnızca ziyaretçinin tarayıcısı Gezinti Zamanlaması (window.performance.timing) API’sini destekliyorsa çalışır .

GTM’de bazı makrolar oluşturun

Yakında genel bir olay işlemcisi oluşturuyoruz, bu nedenle bunun için bazı makrolar oluşturun.

Adımlar:

  • Makro Türü: Veri Katmanı Değişkeni ve Veri Katmanı Değişkeni Adı: eventCategory ile bir makro “Olay kategorisi” oluşturun

  • Makro Türü: Veri Katmanı Değişkeni ve Veri Katmanı Değişkeni Adı: eventAction ile bir makro “Olay eylemi” oluşturun
  • Makro Türü: Veri Katmanı Değişkeni ve Veri Katmanı Değişkeni Adı: nonInteraction ile bir “Etkileşimsiz” makrosu oluşturun.

Event etiketi ve Event değeri için de makrolar oluşturabilirsiniz (bunu daha da genel hale getirir), ancak bu proje için sadece bunlara ihtiyacım var.

Bu makroları oluşturarak, değişken verileri veri katmanı aracılığıyla sonunda Google Analytics’e iletilen etikete göndermeyi mümkün kılıyorsunuz.

Genel bir olay kabı oluşturun

Bu güzel. Yeni oluşturduğum makroları kullanan ve gelecekte GA’ya göndermek istediğim tüm olaylar için kullanabileceğim genel bir olay işlemcisi oluşturabilirim.

  1. “Etkinlik gönder” adlı yeni bir etiket oluşturun
  2. Etiket Türü olarak Universal Analytics’i (beta) seçin
  3. GA izleme kimliğini uygun yuvaya ekleyin
  4. Parça Türü Olarak Etkinlik Seçin
  5. Duh, Category için makro olarak {{Event category}} ekleyin
  6. Makro olarak {{Event action}} ekleyin, bu doğru, İşlem
  7. Etkileşimsiz hit için makro olarak {{Etkileşimsiz}} ekleyin
  8. “{{Event}}”, GAEvent’e eşittir koşulu ile bir ateşleme kuralı “GA Etkinliği” oluşturun
  9. Yeni etiketinizi kaydedin

Yani burada tüm etkinlikleriniz için bir konteyner yaratıyorsunuz. Şimdi makrolarınız ve kabınız var. Gelecekte, yeni bir etkinlik göndermek için, “GAEvent” adlı bir etkinliği yalnızca oluşturduğunuz etiketi tetikleyen veri katmanına itmeniz yeterlidir. Ve bundan sonra yapacağımız şey bu.

Sayfa yükleme zamanı komut dosyasını kodlama

  • “Sayfa yükleme süresi” adlı yeni bir etiket oluşturun
  • Özel HTML Etiketini Etiket Türü Olarak Ayarla
  • HTML alanına aşağıdaki kodu ekleyin:

<script> var perfData = window.performance.timing; var pageLoadTime = perfData.domComplete - perfData.navigationStart; var loadTime = ""; if (pageLoadTime < 1000) { loadTime = "0-1 seconds"; } else if (pageLoadTime < 2000) { loadTime = "1-2 seconds"; } else if (pageLoadTime < 3000) { loadTime = "2-3 seconds"; } else if (pageLoadTime < 4000) { loadTime = "3-4 seconds"; } else if (pageLoadTime < 5000) { loadTime = "4-5 seconds"; } else if (pageLoadTime < 6000) { loadTime = "5-6 seconds"; } else if (pageLoadTime < 10000) { loadTime = "6-10 seconds"; } else { loadTime = "10+ seconds"; } dataLayer.push ({ 'event': 'GAEvent', 'eventCategory': 'Page Load Time', 'eventAction': loadTime, 'nonInteraction': 1 }); </script>

  • Sayfanın yüklenmesini bekleyen bir ateşleme kuralı ekleyin: {{event}} eşleşme gtm.load
  • Yeni etiketi kaydet

Burada olan şey, belgenin yüklenmesinden sonra komut dosyasının, sayfanın oluşturulmasının başladığı andan itibaren DOM’nin tamamen yüklendiği ana kadar geçen süreyi sayar. LoadEventEnd’i son nokta olarak almayı denedim, ancak bir nedenden dolayı etiket bu duruma ulaşılmadan önce çıkarıldı, bu yüzden saçma sonuçlar aldım.

Gezinti Zamanlaması API’si hakkında daha fazla bilgi için Gezinti Zamanlamasına Genel Bakış bölümünü kontrol ettiğinizden emin olun .

Süreyi aldıktan sonra (milisaniye cinsinden), yükleme süresini bir dizeye yaklaştırmak için if… else deyimini hızlı ve kirli kullanırım.

Sonunda dataLayer’daki verileri zorluyorum. Basında, GAEvent’i Etkinlik Gönder etiketinin başlatılması için tetikleyici olan olay adı olarak belirtirim. Bu olayı etkileşimsiz bir etkinlik olarak belirtmek önemlidir (etkileşim yok: 1), aksi halde tüm sayfalarınızda% 0 hemen çıkma oranı almaya başlarsınız.

Konteyner sürümünü kaydedin ve yayınlayın

Ve hepsi bu kadar. Özetle, işte olanlar:

  1. Ziyaretçi bir sayfa yüklemeye başladığında, yükleme süresi hesaplanır
  2. Bu bilgi, olayın Analytics’e net bir şekilde kaydedildiğinden emin olmak için kategori ve işlem adlarının bulunduğu genel bir etkinlik konteynerine iletilir.
  3. Kap etiketi, veriler iletilir geçmez tetiklenir, çünkü tetikleyici olay adıdır (verilerle iletilir)
  4. Firebug’daki Ağ günlüğüne bakarak işleri doğru yaptığınızı doğrulayabilirsiniz:

Son sözler

Bu biraz fazladan görünebilir (her bir sayfa yüklenmesinin her bir yükleme zamanını izler), ancak sayfa yükleme zamanına daha ayrıntılı bir şekilde bakma fikrini seviyorum. Artık Etkinlik raporlarını hangi tarayıcıların en yavaş ziyaretlerle kullanıldıklarını, hangi ülkelerin en düşük sayfa yükleme sürelerine sahip olduklarını vs. görmek için kullanabilirim. Tüm veriler, bebeğim.

Tabii, biliyorum, örnekleme oranını yükselterek, Site Hızı raporunda benzer sonuçlar elde edebilirsiniz, ancak hey, kendiniz kodladığınızda daha eğlenceli olur!

Hala özel ölçümlerle hesaplamalar yapmaya başlayabilmeyi bekliyorum. Ortalama sayfa yükleme süresinin belirli bir gün, belirli bir tarayıcı, belirli bir ülkeden gelen ziyaretler vb. Sırasında ne olduğunu görmek çok güzel olurdu.

Etiketler
Daha Fazla Göster

İlgili Makaleler

Bir cevap yazın

E-posta hesabınız yayımlanmayacak. Gerekli alanlar * ile işaretlenmişlerdir

This site uses Akismet to reduce spam. Learn how your comment data is processed.

Başa dön tuşu
Kapalı