AutoWebPerf (AWP) nedir? #
Otomatik WebPerf (AWP), performans verilerinin birden fazla kaynaktan otomatik olarak toplanmasını sağlayan modüler bir araçtır. Şu anda Chrome UX Raporu, PageSpeed Insights veya WebPageTest gibi farklı kapsamlar (laboratuvar ve saha) için web sitesi performansını ölçmek için kullanılabilen birçok araç bulunmaktadır. AWP, site performansını tek bir yerden sürekli olarak izleyebilmeniz için basit bir kurulumla çeşitli denetim araçlarıyla entegrasyon sunar.
Web Vitals kılavuzunun yayınlanması, web sayfalarının yakından ve aktif olarak izlenmesinin giderek daha önemli hale geldiği anlamına gelir. Bu aracın arkasındaki mühendisler yıllardır performans denetimleri yapıyor ve günlük faaliyetlerinin manuel, yinelenen ve zaman alan bir bölümünü otomatikleştirmek için AWP’yi oluşturdular. AWP bugün bir olgunluk düzeyine ulaştı ve getirdiği otomasyondan herkesin yararlanabilmesi için geniş çapta paylaşılmaya hazır.
Araca şu adresten erişilebilir: Otomatik WebPerf GitHub’daki genel depo.
AWP ne için? #
Web sayfalarının performansını izlemek için çeşitli araçlar ve API’ler mevcut olsa da bunların çoğu, belirli bir zamanda ölçülen verileri ortaya çıkarır. Bir web sitesini yeterince izlemek ve önemli sayfaların iyi performansını sürdürmek için, zaman içinde sürekli olarak Önemli Web Verileri ölçümleri yapmanız ve eğilimleri gözlemlemeniz önerilir.
AWP, çeşitli performans izleme API’lerine yönelik yinelenen sorguları otomatikleştirmek için programlı olarak yapılandırılabilen bir motor ve önceden oluşturulmuş API entegrasyonları sağlayarak bunu kolaylaştırır.
Örneğin, AWP ile, ana sayfanızda saha verilerini yakalamak için günlük bir test ayarlayabilirsiniz. CRUX API’sı ve PageSpeed Insights’tan bir Lighthouse raporundan laboratuvar verileri. Bu veriler zaman içinde yazılabilir ve saklanabilir, örneğin Google E-Tablolar ve sonra görselleştirildi Data Studio kontrol paneli. AWP, tüm sürecin ağır kaldırma kısmını otomatikleştirerek zaman içinde laboratuvar ve saha trendlerini takip etmek için harika bir çözüm haline getirir. Görmek Data Studio’da denetim sonuçlarını görselleştirme Daha fazla ayrıntı için aşağıda).
Mimariye genel bakış #
AWP, üç farklı türde modül içeren modüler tabanlı bir kitaplıktır:
- the motor
- bağlayıcı modüller
- toplayıcı modüller
Motor, bir bağlayıcıdan (örneğin, yerel bir CSV dosyasından) testlerin bir listesini alır, seçilen toplayıcılar aracılığıyla (PageSpeed Insights gibi) performans denetimleri yürütür ve sonuçları çıkış bağlayıcısına (örneğin, Google E-Tablolar) yazar.
AWP, bir dizi önceden uygulanmış toplayıcı ve konektörle birlikte gelir:
- Önceden uygulanan toplayıcılar:
- Önceden uygulanan konektörler:
AWP ile denetimleri otomatikleştirme #
AWP, performans denetimlerini PageSpeed Insights gibi tercih ettiğiniz denetim platformları aracılığıyla otomatikleştirir, Web Sayfası Testiveya CRUX API’sı. AWP, test listesinin nereye yükleneceğini ve sonuçların nereye yazılacağını seçme esnekliği sunar.
Örneğin, bir Google E-Tablosunda saklanan bir test listesi için denetimler çalıştırabilir ve aşağıdaki komutu kullanarak sonuçları bir CSV dosyasına yazabilirsiniz:
PSI_APIKEY=YOUR_KEY> SHEETS_APIKEY=YOUR_KEY> ./awp run sheets:SheetID> csv:output.csv
Yinelenen denetimler #
Yinelenen denetimleri günlük, haftalık veya aylık sıklıkta çalıştırabilirsiniz. Örneğin, aşağıdaki gibi yerel bir JSON’da tanımlanan bir test listesi için günlük denetimler çalıştırabilirsiniz:
{
"tests": [
{
"label": "web.dev",
"url": "https://web.dev",
"gatherer": "psi"
}
]
}
Aşağıdaki komut yerel JSON dosyasından denetim testlerinin listesini okur, denetimleri yerel bir makinede çalıştırır ve ardından sonuçları yerel bir CSV dosyasına verir:
PSI_APIKEY=YOUR_KEY> ./awp run json:tests.json csv:output.csv
Denetimleri her gün arka plan hizmeti olarak sürekli çalıştırmak için bunun yerine aşağıdaki komutu kullanabilirsiniz:
PSI_APIKEY=YOUR_KEY> ./awp continue json:tests.json csv:output.csv
Alternatif olarak, crontab AWP’yi günlük bir cron işi olarak çalıştırmak için Unix benzeri bir ortamda:
0 0 * * * PSI_APIKEY=YOUR_KEY> ./awp run json:tests.json csv:output.csv
Günlük denetimleri ve sonuç toplamayı otomatikleştirmenin daha fazla yolunu şu adreste bulabilirsiniz: AWP GitHub deposu.
Data Studio’da denetim sonuçlarını görselleştirme #
Önemli Web Verilerini sürekli olarak ölçmenin yanı sıra, AWP tarafından toplanan gerçek kullanıcı ölçümleri (RUM) veya Chrome UX Raporu (CrUX) verileriyle trendleri değerlendirebilmek ve olası gerilemeleri keşfedebilmek önemlidir. Chrome UX Raporunun (CrUX) 28 günlük hareketli bir toplama olduğunu unutmayın; bu nedenle, gerilemeleri daha erken fark edebilmeniz için CrUX ile birlikte kendi RUM verilerinizi de kullanmanız önerilir.
Data Studio, performans metriklerini kolayca yükleyebileceğiniz ve trendleri grafikler halinde çizebileceğiniz ücretsiz bir görselleştirme aracıdır. Örneğin, aşağıdaki zaman serisi çizelgeleri, Chrome UX Raporu verilerini temel alan Önemli Web Verilerini gösterir. Grafiklerden biri, son haftalarda artan Kümülatif Düzen Kaymasını gösteriyor, bu da belirli sayfalar için düzen kararlılığında gerilemeler anlamına geliyor. Bu senaryoda, bu sayfaların altında yatan sorunları analiz etme çabalarına öncelik vermek isteyebilirsiniz.
Veri toplamadan görselleştirmeye kadar uçtan uca süreci basitleştirmek için, aşağıdaki komutla sonuçları otomatik olarak Google E-Tablolar’a aktarmak üzere AWP’yi bir URL listesiyle çalıştırabilirsiniz:
PSI_APIKEY=YOUR_KEY> SHEETS_APIKEY=YOUR_KEY> ./awp run sheets:SheetID> csv:output.csv
Bir e-tabloda günlük ölçümleri topladıktan sonra, verileri doğrudan e-tablodan yükleyen ve trendleri bir zaman serisi grafiğine çizen bir Data Studio panosu oluşturabilirsiniz. Çıkış yapmak Google E-Tablolar API Bağlayıcısı Data Studio’da görselleştirmek için bir veri kaynağı olarak elektronik tablolarla AWP’nin nasıl kurulacağına ilişkin ayrıntılı adımlar için.
Sıradaki ne? #
AWP, Önemli Web Verilerini ve diğer performans ölçümlerini ölçmek için sürekli bir izleme işlem hattı kurma çabalarını en aza indirmenin basit ve entegre bir yolunu sunar. AWP şimdilik en yaygın kullanım durumlarını kapsamaktadır ve gelecekte diğer kullanım durumlarını ele almak için daha fazla özellik sağlamaya devam edecektir.
Daha fazla bilgi edinin Otomatik WebPerf depo.