Rehber
Web sitesi hızlandırma: neyi, hangi sırayla düzeltmeli?
Güncelleme:
Hız bir "eklenti" meselesi değildir. Yavaşlığın büyük kısmı üç kalemde toplanır ve hangisinin sizi vurduğunu ölçmeden düzeltmeye başlamak, en pahalı yoldur.
Bir siteye "yavaş" demek kolaydır; neyin yavaş olduğunu söylemek zordur. Bu rehber, yavaşlığın gerçek kaynaklarını ölçüm sırasıyla anlatıyor: önce ne bakılır, sonra ne düzeltilir, hangi işler görünürde iyi ama pratikte etkisizdir.
Önce doğru şeyi ölçün
En yaygın hata, hızı kendi bilgisayarınızdan ve kendi bağlantınızdan ölçmektir. Sitenizi zaten bir kez açtınız; her şey önbellekte. Ziyaretçi ise siteye ilk kez, telefondan ve çoğu zaman şebeke üzerinden geliyor.
Anlamlı ölçüm üç koşulu sağlar: önbelleksiz (ilk ziyaret gibi), mobil cihaz profiliyle ve kısıtlı bağlantıyla. Aynı sayfa, masaüstü ölçümünde iyi, bu üç koşulda kötü çıkabilir — ve ziyaretçinizin gördüğü ikincisidir.
Bakılacak sayı tek değildir. İlk anlamlı içeriğin görünmesi (kullanıcı "sayfa geldi" der), en büyük ögenin yerleşmesi ve düzenin oynaması ayrı problemlerdir; biri iyiyken diğeri kötü olabilir. Tek bir puana bakıp karar vermek, hangi işi yapacağınızı söylemez.
Site neden yavaş açılıyor? Üç ana kaynak
İncelediğimiz sitelerde yavaşlığın büyük kısmı şu üç kalemde toplanıyor ve sıralaması da genelde bu:
Bu üçünün ortak yanı şu: hiçbiri "sunucu yavaş" değildir. Sunucu yükseltmek çoğu sitede en pahalı ve en etkisiz müdahaledir — çünkü darboğaz sunucunun yanıt süresi değil, tarayıcının indirip işlemek zorunda kaldığı yüktür.
Hangi işi hangi sırayla yapmalı?
| İş | Tipik etki | Zorluk | Not |
|---|---|---|---|
| Görselleri ölçülendirip küçültmek | Yüksek | Düşük | Genelde en büyük kazanç; içerik değişikliği gerektirmez |
| Gereksiz üçüncü taraf betikleri kaldırmak | Yüksek | Düşük | Önce envanter: hangisi gerçekten kullanılıyor? |
Görsellere width/height vermek | Orta | Düşük | Düzen oynamasını (CLS) doğrudan keser |
| Yazı tipi sayısını azaltmak | Orta | Düşük | Sistem yazı tipi kullanmak hepsini sıfırlar |
| Ekran dışı görselleri geç yüklemek | Orta | Düşük | Görünen ögeye uygulanırsa zarar verir |
| Önbellek başlıkları + sürüm damgası | Orta | Orta | Damgasız önbellek, düzeltmelerin ulaşmasını engeller |
| Sunucu yükseltmek | Düşük | Yüksek | Yanıt süresi zaten iyiyse para kaybı |
Tablodaki sıra rastgele değil: düşük zorluk + yüksek etki olan işler önce yapılır. Çoğu sitede ilk iki satır, kalan her şeyin toplamından fazla kazandırır.
Sık yapılan üç hata
Geç yüklemeyi görünen ögeye uygulamak. "Bütün görseller lazy olsun" ayarı, ekranın en üstündeki görseli de geciktirir; en büyük ögenin yerleşmesi gecikir ve puan düşer. Geç yükleme yalnız ekran dışı ögeler içindir.
Önbelleği uzatıp sürüm damgası koymamak. Bir haftalık önbellek verip dosya adını sabit bırakırsanız, yayına çıkan düzeltme siteyi daha önce açmış ziyaretçiye hiç ulaşmaz. Damga (?v=…) bunun tek çözümüdür.
Tek bir puanı hedeflemek. Ölçüm araçlarının verdiği toplu puan bir özettir, hedef değildir. Puanı yükseltmek için içerik silmek, hızlı ama işe yaramayan bir site üretir. Doğru hedef, ziyaretçinin bekleme süresini kısaltmaktır.
Somut bir örnek: bu sitenin kendisi
Kendi sitemizde ölçülen değerler şöyle: ana sayfanın toplam kaynak ağırlığı 85 KB, belge boyutu 7,2 KB (sıkıştırılmış), toplam 4 istek, sıfır üçüncü taraf alan adı ve sıfır web fontu.
Bu rakamlar bir övünme değil, bir ölçüt: sayfanın ağırlığının büyük kısmı logo görselidir, çünkü geri kalan her şey çıkarılmıştır. Analitik yok, sohbet balonu yok, harita gömülü değil, yazı tipi sistemden geliyor. Hız, eklenen bir özellik değil; eklenmeyen şeylerin sonucudur.
Bunun bir bedeli de var ve saklamıyoruz: analitik olmadığı için ziyaretçi davranışını ölçemiyoruz. Her kararın bir takası vardır; önemli olan takası bilerek yapmaktır.
Sık sorulanlar
Sitem yavaş, sunucuyu güçlendirsem çözülür mü?
Genelde hayır. Sunucu yükseltmek, yalnızca sunucunun yanıt süresi gerçekten yüksekse işe yarar. İncelediğimiz sitelerde darboğaz neredeyse her zaman tarayıcı tarafındadır: büyük görseller, üçüncü taraf betikler ve yazı tipleri. Sunucu yanıt süresi zaten makulse, daha güçlü bir sunucu ölçülebilir bir fark yaratmaz — sadece aylık maliyeti artırır. Önce ölçün.
Hız puanı kaç olmalı?
Puan bir hedef değil, bir özettir. Aynı puanla çok farklı deneyimler mümkündür. Doğru soru şudur: ziyaretçi ilk anlamlı içeriği kaç saniyede görüyor, en büyük öge ne zaman yerleşiyor ve sayfa yerleşirken zıplıyor mu? Bu üçü iyiyse puan zaten iyi olur; puanı kovalayıp içerik silmek ise hızlı ama işe yaramayan bir site üretir.
Görselleri hangi biçimde kaydetmeliyim?
Fotoğraflar için modern sıkıştırma biçimleri (WebP/AVIF) belirgin kazanç verir; çizim, logo ve düz renkli grafikler için PNG ya da SVG doğrudur. Ama biçimden önce gelen iki şey var: görselin gerçekten gösterileceği ölçüde kaydedilmesi ve width/height niteliklerinin verilmesi. 3000 piksel genişliğinde kaydedilip ekranda 400 piksel gösterilen bir fotoğraf, hangi biçimde olursa olsun israftır.
Analitik ve sohbet balonu siteyi ne kadar yavaşlatır?
Beklediğinizden çok. Her üçüncü taraf betik ayrı bir alan adına bağlanır: DNS çözümlemesi, TLS el sıkışması, sonra indirme ve çalıştırma. Üç dört araç eklendiğinde sayfa, kendi dosyalarından çok başkalarının sunucularını beklemeye başlar. Bunları tamamen kaldırmak zorunda değilsiniz; ama her birinin gerçekten kullanıldığını ve sonuç ürettiğini sorgulamak gerekir. Kullanılmayan bir izleme kodu, saf maliyettir.
Mevcut sitemi hızlandırmak mı, yeniden yapmak mı daha ucuz?
Çoğu durumda hızlandırmak. Görsel optimizasyonu, gereksiz betiklerin kaldırılması ve önbellek ayarları, siteyi yeniden yazmadan uygulanabilir ve genelde kazancın büyük kısmını verir. Yeniden yazmak, ancak altyapı gerçekten sürdürülemezse (ör. güncellenemeyen bir sistem, birikmiş eklenti yükü) mantıklıdır. Hangisinde olduğunuzu ölçüm söyler — ve sıfırdan yapmanın gerçekten daha ucuz olduğu durumları da açıkça söyleriz.
Sitenizin hızını ölçelim
Mevcut sitenizi önbelleksiz, mobil profille ölçelim ve hangi üç işin en çok kazandıracağını sıralayalım. Ölçüm ücretsizdir.