CSS ve JavaScript Küçültme ve Erteleme (Defer)

Okuma süresi: 2 dk

Kısa yanıt: LiteSpeed Cache veya benzeri bir eklentide önce CSS ve JS küçültmeyi, ardından JS “defer” (ertele) ayarını açın; her adımdan sonra siteyi gizli pencerede kontrol edin. Kullanılmayan eklentilerin dosyalarını kaldırın ve büyük siteler için kritik CSS üretimini değerlendirin. HTTP/2 ile dosya birleştirmenin faydası sınırlıdır.

Bu rehber kimin için: Site hızını iyileştirenler · Gereken süre: 30 dakika · Seviye: Orta

Tarayıcı, head içindeki CSS ve senkron JavaScript dosyalarını indirip işleyene kadar sayfayı çizmeye başlamaz; PageSpeed Insights bunları “Render-blocking requests” (oluşturmayı engelleyen istekler) öngörüsünde listeler. Küçültme dosyalardaki boşluk ve yorumları kaldırır, erteleme betiklerin çizimden sonra çalışmasını sağlar. En büyük kazanç ise hiç gerekmeyen dosyaların yüklenmemesidir.

Önerilen sıra

Ölçün: PageSpeed Insights raporunda oluşturmayı engelleyen kaynakları ve kullanılmayan CSS/JS miktarını not edin.
Gereksizleri kaldırın: Kullanılmayan eklentileri silin; yalnızca belirli sayfalarda gereken eklenti dosyalarını diğer sayfalarda devre dışı bırakın.
CSS küçültme: LiteSpeed Cache › Sayfa Optimizasyonu › CSS Ayarları › “CSS Küçült”ü açıp test edin.
JS küçültme: “JS Küçült”ü açıp test edin.
JS erteleme: “JS Ertele” (Deferred) seçeneğini açın; jQuery’ye bağlı betikler bozulursa ilgili dosyayı hariç tutun.
Kritik CSS: Büyük sitelerde “CSS’i Asenkron Yükle” ve kritik CSS üretimini deneyin; kritik CSS, eklentide QUIC.cloud hizmetlerini etkinleştirmenizi gerektirir. Görünümü dikkatle kontrol edin.
Temizleyin ve test edin: Her değişiklikten sonra önbelleği temizleyip ana sayfa, ürün ve ödeme sayfalarını kontrol edin.

Bir ayar siteyi bozduğunda

Menü açılmıyor, kaydırıcı çalışmıyor veya ödeme düğmesi tepki vermiyorsa son açtığınız JS ayarını kapatın. Sorunlu dosyayı bulduysanız tüm ayarı kapatmak yerine o dosyayı hariç tutma listesine ekleyin. Değişiklikleri önce staging sitede denemek en güvenli yoldur.

Hâlâ çözülmediyse

Betik sayısını azaltmak INP’yi de iyileştirir; INP iyileştirme rehberine bakın. Tüm hız adımları için WordPress hızlandırma rehberimizi okuyun. LiteSpeed Cache ile tam uyumlu WordPress hosting paketlerimizde bu ayarları kullanabilirsiniz; kritik ve benzersiz CSS üretimi QUIC.cloud üzerinden çalışır.

Sık sorulan sorular

Dosyaları birleştirmeli miyim?

HTTP/2 ve HTTP/3’te birleştirmenin faydası azdır ve önbellek verimini düşürebilir; genellikle kapalı tutun.

Ödeme sayfası bozuldu.

Ödeme sayfasını optimizasyon dışında tutun; ödeme betiklerini ertelemeyin.

İlgili rehberler

Bu rehber işinize yaradı mı?