Yavaş bir web sitesi ziyaretçi kaybettirir, dönüşümü düşürür ve arama görünürlüğünü olumsuz etkiler. İyi haber şu ki hız sorunlarının çoğu bilinen ve uygulanabilir yöntemlerle çözülebilir. Bu yazıda, etkisi yüksekten düşüğe doğru 15 yöntemi bulacaksınız.
Önce ölçün
Değişiklik yapmadan önce mevcut durumu kaydedin. PageSpeed Insights ile mobil ve masaüstü sonuçlarına, özellikle Core Web Vitals değerlerine bakın. Tarayıcı geliştirici araçlarındaki Network sekmesi, hangi dosyanın ne kadar sürdüğünü gösterir.
Görseller
1. Doğru boyutta sunun
4000 piksel genişliğindeki bir fotoğrafı 400 piksellik alanda göstermek, gereksiz megabaytlar demektir. srcset ile ekran boyutuna uygun görsel sunun.
2. Modern format kullanın
WebP ve AVIF, JPEG ve PNG'ye göre genellikle çok daha küçük dosyalar üretir.
3. Tembel yükleme (lazy loading)
Ekranın altında kalan görsellere loading="lazy" ekleyin. İlk ekrandaki ana görsele ise eklemeyin.
4. Boyutları belirtin
width ve height değerleri tarayıcının yer ayırmasını sağlar, düzen kaymasını önler.
Kod ve kaynaklar
5. Kullanılmayan CSS ve JavaScript'i kaldırın
Büyük kütüphanelerin tamamını tek bir özellik için yüklemeyin. Geliştirici araçlarındaki Coverage paneli kullanılmayan kodu gösterir.
6. Dosyaları küçültün (minify) ve sıkıştırın
Sunucunun Brotli veya Gzip sıkıştırması açık olmalıdır.
7. Betikleri erteleyin
Kritik olmayan JavaScript dosyalarını defer veya async ile yükleyin.
8. Üçüncü taraf betikleri denetleyin
Sohbet widget'ları, fazla sayıda analiz etiketi, sosyal medya gömmeleri sayfayı ciddi şekilde yavaşlatabilir. Her birinin gerçekten gerekli olup olmadığını sorgulayın.
Fontlar
9. Font sayısını azaltın
Her ağırlık ve stil ayrı bir dosyadır. İki–üç ağırlık çoğu site için yeterlidir.
10. font-display kullanın
font-display: swap metnin font yüklenene kadar görünmez kalmasını önler. Kritik fontlar için preload kullanılabilir.
Sunucu ve ağ
11. Önbellekleme başlıklarını ayarlayın
Değişmeyen statik dosyalar için uzun süreli Cache-Control başlıkları, tekrar ziyaretlerde büyük hız kazandırır.
12. CDN kullanın
İçeriği ziyaretçiye coğrafi olarak yakın sunuculardan dağıtır.
13. Sunucu yanıt süresini kısaltın
Dinamik sitelerde veritabanı sorgularını optimize edin, sayfa veya veri önbelleği kullanın. .NET tarafında bu konuyu ASP.NET Core performans optimizasyonu ve SQL Server performansı yazılarında ele aldık.
14. HTTP/2 veya HTTP/3 desteği
Modern protokoller birden fazla dosyanın aynı bağlantı üzerinden verimli iletilmesini sağlar.
15. Bağlantıları önceden kurun
Harici kaynaklar (örneğin font sunucusu) için preconnect ipucu, bağlantı kurma süresini kısaltır.
Hızı korumak
Hız bir kerelik iş değildir. Yeni eklenen her görsel, eklenti ve betik performansı etkiler. Şu alışkanlıklar kazanımı korur:
- Yeni içerik eklerken görsel boyutlarını kontrol etmek
- Aylık basit bir performans ölçümü yapmak
- Eklenti ve üçüncü taraf betik ekleme kararlarını bilinçli vermek
Daha kalıcı bir çözüm arıyorsanız statik web sitesi mimarisi, hızı yapısal olarak garanti altına alır.
Sık sorulan sorular
Hosting değiştirmek hızı artırır mı?
Sunucu yanıt süresi yüksekse evet. Ancak sorun büyük görseller veya ağır betiklerse, hosting değiştirmek tek başına yeterli olmaz.
PageSpeed puanım neden her ölçümde farklı?
Laboratuvar ölçümleri ağ ve sunucu koşullarına göre değişkenlik gösterir. Tek ölçüme değil, eğilime ve gerçek kullanıcı verisine bakın.
Sonuç
Site hızının en büyük düşmanları büyük görseller, gereksiz JavaScript ve yavaş sunucu yanıtıdır. Bu üç alana odaklanarak çoğu sitede kısa sürede belirgin iyileşme sağlayabilirsiniz. Sitenizin performans denetimi için teklif isteyebilirsiniz.