Lowe's Site Speed Ekibi, otomatik bir performans testi ve izleme sistemi oluşturarak istekleri performans bütçelerine göre test eder ve üretime giren performans gerilemelerini önler.
Lowe's, yaklaşık 90 milyar ABD doları değerinde bir ev tadilatı perakendecisidir. Yaklaşık 2.200 mağaza işletiyor ve 300.000'den fazla çalışanı var. Performans gerilemelerinin üretime dağıtılmasını önleyen otomatik bir test ve izleme sistemi oluşturan Lowe's Site Speed Ekibi web sitesinin performansını artırarak en iyi perakende siteleri arasındaki sıralamayı elde etti.
Sorun
Site Hızı Ekibi'nin hedefi, sayfa yükleme performansı açısından Lowe'un sitesini en hızlı e-ticaret sitelerinden biri yapmaktır. Lowe'un web sitesi geliştiricileri, otomatik test ve izleme sistemlerini oluşturmadan önce, üretim öncesi ortamlarda performansı otomatik olarak ölçemiyordu. Mevcut araçlar, testleri yalnızca üretim ortamında yürütüyordu. Sonuç olarak, kötü yapılar üretime atılarak kötü bir kullanıcı deneyimi oluşturuyor. Bu düşük kaliteli derlemeler, Site Hızı Ekibi tarafından tespit edilip yazar tarafından geri alınıncaya kadar üretimde kalır.
Çözüm
Site Hızı Ekibi, üretim öncesi ortamlar için otomatik bir performans testi ve izleme sistemi oluşturmak üzere açık kaynak araçlardan yararlandı. Sistem, her çekme isteğinin (PR) performansını ölçer ve Site Hızı Ekibi'nin performans bütçesini ve metrik ölçütlerini karşılamıyorsa PR'yi gönderimden üretime geçirir. Sistem, SEO ve ADA uyumluluğunu da ölçer.
Etki
16 hafta boyunca 102 derleme dağıtan 1 ekip örneğinden elde edilen otomatik performans testi ve izleme sistemi, ortalamanın altında performansa sahip 32 derlemenin üretime girmesini engelledi.
Eskiden Site Hızı Ekibi'nin geliştiricilere performans regresyonlarını üretime gönderdiklerini bildirmeleri için üç ila beş güne ihtiyaç duyuluyordu. Artık sistem, üretim öncesi ortamda bir pull isteği gönderdikten sonra beş dakika sonra performans sorunlarını otomatik olarak bildiriyor.
Performans regresyonları için daha az pull isteğinin işaretlenmesiyle ölçülen, kod kalitesi zamanla gelişir. Site Hızı Ekibi ayrıca, site kalitesini sürekli olarak iyileştirmek amacıyla yönetim bütçelerini kademeli olarak daraltmaktadır.
Genel olarak, sorunlu kodun açık bir şekilde sahiplenilmesi mühendislik kültürünü değiştirmiştir. Ekip, sorunları gerçekten kimin çıkardığı belli olmadığı için reaktif düzeltmeler yapmak yerine, sorunlu kodun objektif şekilde ilişkilendirilebileceği proaktif optimizasyonlar yapabilir.
Uygulama
Lighthouse CI, Site Hızı Yönetimi (SSG) uygulamasının temelini oluşturur. SSG uygulaması, her pull isteğinin sayfa performansını doğrulamak ve denetlemek için Lighthouse'u kullanır.
SSG uygulaması, Site Hızı Ekibi'nin tanımlı performans bütçesine ve metrik hedeflerine ulaşılmazsa bir derlemenin başarısız olmasına neden olur. Yalnızca yükleme performansını değil, aynı zamanda SEO, PWA ve erişilebilirliği de zorunlu kılar. Durumu yazarlara, incelemecilere ve SRE ekiplerine anında bildirebilir. İstisnalar gerektiğinde kontrolleri atlayacak şekilde de yapılandırılabilir.
Otomatik Hız Yönetimi (ASG) süreç akışı
Spinnaker
Başlangıç noktası. Geliştirici, kodunu üretim öncesi ortamda birleştirir.
- CDN öğeleriyle üretim öncesi ortamı dağıtın.
- Dağıtımın başarılı olup olmadığını kontrol edin.
- ASG uygulamasını derlemeye başlamak veya (dağıtım hatası durumunda) bir bildirim göndermek için bir Docker container'ı çalıştırın.
Jenkins ve Lighthouse
- ASG uygulamasını Jenkins ile derleyin.
- Chrome ve Lighthouse yüklü özel bir Docker container'ı çalıştırın.
SSG uygulamasından
lighthouserc.json
öğesini çekin velhci autorun --collect-url=https://example.com
komutunu çalıştırın.
Jenkins ve SSG uygulaması
- Lhci'den
assertion-results.json
çıkarın vebudgets.json
içindeki önceden tanımlanmış bütçelerle karşılaştırın. Çıkışı metin dosyası olarak kaydedin ve daha sonraki karşılaştırmalarda kullanmak için Nexus'a yükleyin. - Mevcut
assertion-results.json
dosyasını, son başarılı derlemeyle (Nexus'tan indirilen) karşılaştırın ve metin dosyası olarak kaydedin. - Başarı veya başarısızlık bilgilerini içeren bir HTML e-postası oluşturun.
- Jenkins ile e-postayı ilgili dağıtım listelerine gönderin.