En ağır varlıkları uygun boyuta getirin
Görselleri, fontları ve betikleri teslim edilen baytlara ve müşteri-yolu önemine göre gözden geçirin. Görünen deneyim doğru kaldıkça işi kaldırın veya erteleyin.
Teslim bütçesi / 04
Yolu iyileştirin,
sonra tekrar ölçün.
En yavaş müşteri yolunu belirlemek, açık bir teslim bütçesi belirlemek ve her seferinde tek bir kontrollü iyileştirmeyi doğrulamak için pratik bir performans planlama rehberi.
ŞUNLAR İÇİN KULLANIN: HTML, görseller, fontlar, betikler, önbellekleme ve kritik kullanıcı etkileşimleri genelinde ölçülebilir teslim işlerini önceliklendirmek için kullanın; puan veya sıralama sonucu vaat etmez.
DÖRT KONTROLLÜ KOL
Sürtüşmeyi azaltın, kanıt değil.
Kritik istek yolunu kısaltın
Render-engelleyici ve kökene bağlı istekleri belirleyin; ardından kontrollü koşullar altında önbellekleme, sıkıştırma, preload veya bağımlılık değişikliklerini değerlendirin.
Hızlı girişleri koruyun
Birincil etkileşim etrafındaki uzun görevleri ve istemci işini inceleyin. Önlenebilir işi azaltırken semantik, erişilebilirlik, onay ve fonksiyonel davranışı koruyun.
Benzer olanı benzerle karşılaştırın
URL'yi, sürümü, cihazı, ağı, önbellek durumunu ve metrik kaynağını kaydedin. Aynı yöntem daha iyi bir sonuç üretirse değişiklik güven kazanır; regresyon olmamalıdır.
YÖNTEM / KAYNAKLA SINIRLI
Bir sonraki adımı yapın bilinen adım.
- Değişiklik yapmadan önce bir temsilci müşteri yolunu seçin ve mevcut laboratuvar ile mevcut alan kanıtlarını kaydedin.
- Transfer boyutu, kritik istekler ve o yol için en ilgili kullanıcı merkezli metrik için gözden geçirilebilir bir bütçe belirleyin.
- Aşırı büyük bir resim, render-engelleyen varlık, önlenebilir bir betik veya yavaş köken yanıtı gibi en büyük kontrol edilebilir nedeni önceliklendirin.
- Sınırlı bir değişiklik yapın, aynı yolu ve koşulları karşılaştırın ve gözlemlenen kanıta göre tutun veya geri alın.
DOĞRULA / GÜVENMEDEN ÖNCE
Aynı URL, cihaz profili, ağ koşulları ve önbellek varsayımlarını kullanarak önce-sonra sonuçlarını karşılaştırın.
Düzen, etkileşim, erişilebilirlik, analiz ve kritik müşteri yollarında regresyon olup olmadığını gerçek sayfada gözden geçirin.
Sürüm tanımlayıcısını, gözlemlenen değerleri, test koşullarını, kararı ve değişiklik tutulmazsa geri alma sonucunu kaydedin.
YETKİ / İNCELEME
Kaynak notları, ödünç alınmış kesinlik değil.
Planlama temeli: web.dev performance and Core Web Vitals guidance
- web.dev — Web performance ↗web.dev, kullanıcı odaklı performansı ölçmeyi, Core Web Vitals'ı anlamayı ve tekrar ölçmeden önce hedefli iyileştirmeler uygulamayı önerir.
BAĞLAM / DEVİR TESLİMİ BAĞLI TUTUN
Launch KitYapılandırılmış bir planlama başlangıç noktası için SIU başlatma çalışma alanını kullanın.Status Is DownSID'i canlı hizmet sinyali, izlenen hizmet kayıtları ve olay odaklı bağlam için kullanın.Image delivery readinessGörseller seçilen sayfa bütçesinin anlamlı bir parçasıysa görüntüye özgü teslim kararlarını inceleyin.
Yazarlık: SIU Enablement editoryal taslak; kaynakla sınırlı performans rehberliği. İnceleyen: Bir performans sahibi ve müşteri-yolu sahibi kanıtları ve ödünleşimleri gözden geçirir. Yeniden doğrula: Sayfa bileşimi, teslim altyapısı, üçüncü taraf betikleri veya ölçüm koşulları değiştiğinde yeniden doğrulayın.