Lowe’un yaklaşık 2.200 mağaza işleten ve 300.000’den fazla çalışanı olan yaklaşık 90 milyar dolarlık bir ev geliştirme perakendecisidir. Lowe’un Site Hızı Ekibi, performans gerilemelerinin üretime yayılmasını önleyen otomatik bir test ve izleme sistemi kurarak, web sitesinin performansını iyileştirerek en iyi perakende siteleri arasında yer aldı.
Sorun #
Site Hızı Ekibinin hedefi, Lowe’s sitesini sayfa yükleme performansı açısından 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çemiyorlardı. Mevcut araçlar yalnızca üretim ortamında testler gerçekleştirdi. Sonuç olarak, kalitesiz yapılar üretime girerek kötü bir kullanıcı deneyimi yarattı. Bu kalitesiz yapılar, Site Hızı Ekibi tarafından tespit edilene ve yazar tarafından geri döndürülene kadar üretimde kalacaktı.
Çözüm #
Site Hızı Ekibi, üretim öncesi ortamlar için otomatik bir performans testi ve izleme sistemi oluşturmak için açık kaynak araçları kullandı. Sistem, her çekme talebinin (PR) performansını ölçer ve Tesis Hızı Ekibinin performans bütçesini ve metrik kriterlerini karşılamıyorsa PR’yi sevkiyattan üretime bağlar. Sistem ayrıca SEO ve ADA uyumluluğunu da ölçer.
Darbe #
102 yapıyı dağıtan 16 hafta boyunca 1 ekipten oluşan bir örnekten, otomatikleştirilmiş performans testi ve izleme sistemi, vasatın altında performansa sahip 32 yapının üretime girmesini engelledi.
Site Hızı Ekibinin geliştiricilere performans regresyonlarını üretime aktardıklarını bildirmesi üç ila beş gün sürerken, sistem artık geliştiricileri üretim öncesi ortamda bir çekme isteği gönderdikten beş dakika sonra performans sorunları hakkında otomatik olarak bilgilendiriyor.
Performans gerilemeleri için daha az çekme isteğinin işaretlenmesi gerçeğiyle ölçüldüğü üzere, kod kalitesi zaman içinde iyileşiyor. Site Hızı Ekibi ayrıca site kalitesini sürekli olarak iyileştirmek için yönetişim bütçelerini kademeli olarak daraltıyor.
Genel olarak, sorunlu kodun açık bir şekilde sahiplenilmesi mühendislik kültürünü değiştirmiştir. Ekip, sorunları gerçekte kimin başlattığı hiçbir zaman net olmadığı için reaktif düzeltmelere göz yummak yerine, nesnel olarak atfedilebilen sorunlu kod sahipliğiyle proaktif optimizasyonlar yapabilir.
uygulama #
Site Hızı Yönetişimi (SSG) uygulamasının kalbi Lighthouse CI’dır. SSG uygulaması, her çekme isteğinin sayfa performansını doğrulamak ve denetlemek için Lighthouse’u kullanır.
SSG uygulaması, Site Hızı Ekibinin 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 zorlar. Durumu anında yazarlara, hakemlere ve SRE ekiplerine bildirebilir. İstisnalar gerektiğinde kontrolleri atlayacak şekilde de yapılandırılabilir.
Otomatik Hız Yönetimi (ASG) süreç akışı #
Balon balon #
Başlangıç noktası. Bir geliştirici, kodunu bir üretim öncesi ortamda birleştirir.
- CDN varlıklarıyla üretim öncesi ortamı devreye alın.
- Başarılı dağıtımı kontrol edin.
- Koş Liman işçisi ASG uygulamasını oluşturmaya başlamak veya bir bildirim göndermek için kapsayıcı (dağıtım hatası durumunda).
Jenkins ve Deniz Feneri #
- ASG uygulamasını şununla oluşturun: Jenkins.
- Chrome ve Lighthouse’un yüklü olduğu özel bir Docker kapsayıcısı çalıştırın. Çekmek
lighthouserc.json
SSG uygulamasından ve çalıştırınlhci autorun --collect-url=https://example.com
.
Jenkins ve SSG uygulaması #
- Çıkarmak
assertion-results.json
lhci’den alın ve önceden tanımlanmış bütçelerle karşılaştırın.budgets.json
. Çıktıyı bir metin dosyası olarak kaydedin ve şuraya yükleyin: bağ kurma Gelecekteki karşılaştırmalar için. - akımı karşılaştır
assertion-results.json
son başarılı yapıya (Nexus’tan indirilir) gidin ve onu bir metin dosyası olarak kaydedin. - Başarı veya başarısızlık bilgilerini içeren bir HTML e-postası oluşturun.
- E-postayı Jenkins ile ilgili dağıtım listelerine gönderin.