Web Sitenizi Nasıl Hızlandırırsınız: Pratik Bir Kontrol Listesi

Bir web sitesini hızlandırmak için önce PageSpeed Insights ile ölçün, sonra aracın gösterdiği en büyük nedeni düzeltin — genellikle aşırı büyük görseller, fazla JavaScript, ağır yazı tipleri ya da üçüncü taraf betikler. Google'ın Core Web Vitals "iyi" hedeflerini hedefleyin: ana içerik 2,5 saniye içinde görünür olsun, dokunuşlara verilen yanıt 200 milisaniye içinde gelsin ve neredeyse hiç düzen zıplaması olmasın. Çoğu site bunu yeniden yazmak yerine birkaç değişiklikle başarır.

Herhangi bir şeyi değiştirmeden önce ölçün

Tahmin etmek zaman kaybettirir. Neredeyse herkesi kapsayan iki ücretsiz araç vardır:

• PageSpeed Insights (pagespeed.web.dev) — canlı bir URL yapıştırın. Gerçek Chrome kullanıcılarından gelen saha verisini (sitenizin yeterli trafiği varsa) ve simüle edilmiş bir yüklemeden gelen laboratuvar verisini, ayrıca belirli sorunların bir listesini gösterir.
• Chrome DevTools'taki Lighthouse — açabildiğiniz herhangi bir sayfada, önizlemeler dahil, aynı laboratuvar testi. Mobil modda test edin; sorunların göründüğü yer yavaş ağlardaki telefonlardır.

Önemli olan sayılar Google'ın Core Web Vitals ölçütleridir. Eylül 2026 itibarıyla Google'ın web.dev'deki dokümantasyonu, sayfa yüklemelerinin 75. yüzdelik diliminde ölçülen bu "iyi" eşikleri verir:

INP, 2024'te eski İlk Girdi Gecikmesi (FID) metriğinin yerini aldı. Bir araç hâlâ FID raporluyorsa, eskimiştir.

Başlangıç sayılarınızı yazın. Her düzeltmeden sonra yeniden test edin ki neyin yardımcı olduğunu bilesiniz.

Zaman nereye gidiyor: seçenekler ve ödünleşimler

Her yaygın nedenin bir çözümü vardır ve her çözümün bir maliyeti vardır. En üstteki olanlarla başlayın; bunlar en ucuz ve en yaygın olanlardır.

Görseller

Görseller en yaygın sorundur ve düzeltmesi en kolay olanıdır. 4.000 piksel genişliğindeki bir fotoğraf, 800 piksel olarak gösterildiğinde her ziyaretçi gördüğünün beş katını indirmek zorunda kalır.

• Görselleri görüntülendikleri boyutta sunun; telefonlar ve masaüstü için duyarlı srcset boyutlarıyla.
• Modern formatlar (WebP ya da AVIF) ve makul sıkıştırma kullanın.
• Her görselde width ve height ayarlayın ki tarayıcı yer ayırabilsin. Bu tek başına çoğu düzen kaymasını düzeltir.
• Katlamanın altındaki görselleri loading="lazy" ile tembel yükleyin.
• Sayfanın en üstündeki ana görseli asla tembel yüklemeyin. Google'ın LCP rehberi bu konuda nettir: LCP görselini tembel yüklemek onu her zaman geciktirir. Bunun yerine fetchpriority="high" verin.

JavaScript

Pek çok yapay zekâ ile yapılmış site tek sayfalık uygulamadır (SPA): tarayıcı bir JavaScript paketi indirir ve sonra sayfayı çizer. Paket ne kadar büyükse, boş ekran o kadar uzun sürer. Çaba sırasına göre düzeltmeler:

1. Kullanmadıklarınızı kaldırın. Bağımlılıkların bir listesini isteyin ve bir kez eklenip unutulmuş kütüphaneleri çıkarın — tek bir tarih için bir tarih kütüphanesi, beş simge için tam bir simge paketi gibi.
2. Rota bazında bölün. Yönetici panelinin kodunu yalnızca biri açtığında yükleyin, ana sayfada değil.
3. Genel sayfaları önceden oluşturun. Gerçek HTML olarak gelen bir pazarlama sayfası, hiçbir JavaScript çalışmadan önce görünür. Bu arama motorlarına da yardımcı olur; bkz. yapay zekâ ile yapılmış web siteleri için SEO.

Yavaş INP genellikle sayfayı bloke eden tek bir uzun görevi gösterir — her tuş vuruşunda devasa bir listeyi filtrelemek ya da bir hücre değiştiğinde tüm tabloyu yeniden çizmek. Chrome DevTools'un Performans paneli hangisi olduğunu gösterir.

Yazı tipleri

Her yazı ailesi ve kalınlığı bir dosya daha demektir. İki aile ve üç ya da dört kalınlık çoğu zaman yeterlidir. Katlamanın üstünde kullanılan yazı tipini önden yükleyin, metnin hemen görünmesi için font-display: swap kullanın ve dış yazı tipi servisi ziyaretçileriniz için yavaşsa yazı tiplerini kendiniz barındırın.

Üçüncü taraf betikler

Sohbet widget'ları, analitik, ısı haritaları, reklam pikselleri, gömülü videolar ve sosyal akışlar kodu başka sunuculardan yükler. Her biri küçük görünür; birlikte çoğu zaman sayfanın en yavaş parçası olurlar. Gerçekten baktıklarınızı tutun. Geri kalanları sayfa etkileşime hazır olduktan sonra yükleyin ve ağır gömülü öğeleri (bir YouTube oynatıcısı, bir harita) tıklandığında gerçeğini yükleyen hafif bir önizlemeyle değiştirin.

Sunucu yanıtı

İlk bayta kadar geçen süre (TTFB) — sunucunun yanıtlamaya başlamasının ne kadar sürdüğü — diğer tüm metriklerin altında yatar. Bir CDN'den (ziyaretçilerinize yakın sunuculardan oluşan bir ağ; bkz. CDN nedir) sunulan statik sayfalar neredeyse her yerde hızlıdır. Her istekte bir sunucu tarafından oluşturulan sayfalar o sunucuya ve veritabanına bağlıdır. Önbellekleme ile tekrarlanan işleri saklamak ve yavaş sorgular için veritabanı dizinleri eklemek yaygın çözümlerdir.

İşe yarayan komutlar

Somut olun: sayfayı, metriği ve kısıtı belirtin. Elinizde varsa PageSpeed Insights bulgularını yapıştırın.

PageSpeed Insights, ana sayfa için mobilde 4,8 sn LCP bildiriyor ve LCP öğesi kahraman görseli. Kahraman görselini yeniden boyutlandırıp WebP'ye çevir, duyarlı boyutlar sun, width ve height ayarla, fetchpriority="high" ver ve tembel yüklenmediğinden emin ol. Katlamanın altındaki her görseli tembel yükle. Tasarımı değiştirme.

Bu uygulamanın bağımlılıklarını denetle. Her paketi, neyin kullandığını ve paket boyutuna yaklaşık ne eklediğini listele. Kullanılmayanları kaldır ve /admin ile /settings rotalarını yalnızca ziyaret edildiklerinde yüklenen ayrı parçalara böl.

/products sayfasındaki arama kutusu gecikmeli hissettiriyor. Filtreyi geciktir, her tuş vuruşunda tüm listeyi yeniden çizmekten kaçın ve liste 200 öğeden fazlaysa sayfalara böl ya da sanallaştır.

Adım adım

1. Canlı sayfayı test edin: PageSpeed Insights'ta mobilde. LCP, INP ve CLS'yi ve listelenen ilk üç sorunu not edin.
2. Önce görselleri düzeltin: boyutlar, formatlar, ölçüler, katlamanın altında tembel yükleme, kahraman için öncelik.
3. Kullanmadığınız üçüncü taraf betikleri kesin ve kalanları erteleyin.
4. Yazı tiplerini tasarımın ihtiyaç duyduğu kadara indirin.
5. JavaScript'i küçültün: kullanılmayan paketleri kaldırın, rota bazında bölün.
6. Genel sayfaları önceden oluşturun hâlâ istemci tarafında oluşturuluyorlarsa ve LCP hâlâ yavaşsa.
7. Sunucuyu kontrol edin: önbellekleme, veritabanı dizinleri, sık değişmeyen içerik için statik barındırma.
8. Yeniden yayımlayın ve yeniden test edin. PageSpeed Insights'taki saha verisi, gerçek ziyaretler geldikçe sonraki haftalarda güncellenir; bu yüzden erken sonuçları laboratuvar verisiyle değerlendirin.

Sık yapılan hatalar

• Yalnızca hızlı bir dizüstü bilgisayarda test etmek. Ziyaretçileriniz orta seviye telefonlarda ve dalgalı mobil veride. Mobil modda test edin.
• Mükemmel bir 100 peşinde koşmak. Laboratuvar puanı bir rehberdir. Core Web Vitals iyi aralığa girdikten sonra, içerik ve kullanılabilirlik son birkaç puandan daha önemlidir.
• Her şeyi tembel yüklemek, ana görsel dahil. Bu LCP'yi daha da kötüleştirir.
• Üstüne bir hız eklentisi ya da kütüphane eklemek. Ağırlığı kaldırmak, onu yönetmek için kod eklemekten neredeyse her zaman daha iyidir.
• Canlı siteyi değil, önizlemeyi optimize etmek. Geliştirme önizlemeleri optimize edilmemiş derlemeler çalıştırır. Yayımlanmış adresi ölçün.
• Hızı bir kez düzeltmek. Her yeni widget, görsel ve özellik ağırlık ekler. Büyük değişikliklerden sonra yeniden test edin.

Hız kontrol listesi

• Mobilde LCP ≤ 2,5 sn, INP ≤ 200 ms, CLS ≤ 0,1
• Görseller boyutlandırılmış, sıkıştırılmış, modern formatta, width ve height ile
• Kahraman görseli tembel yüklenmiyor; katlamanın altındaki görseller tembel yükleniyor
• Kullanılmayan JavaScript kütüphanesi yok; ağır rotalar ayrılmış
• İki yazı ailesi ya da daha az; ana yazı tipi önden yüklü
• Yalnızca kullandığınız üçüncü taraf betikler, geç yüklü
• Genel sayfalar mümkün olduğunda önceden oluşturulmuş ya da statik
• Yayımladıktan sonra canlı adreste yeniden test edilmiş

Hız ve mobil düzen birlikte gider; bkz. web sitenizi mobil uyumlu nasıl yaparsınız. Tam bir yayın öncesi kontrol için bir yapay zekâ prototipini üretime nasıl taşırsınız rehberi gerisini kapsar.

Mythex'te hız

Mythex'te bu değişiklikleri sohbette isteyerek ya da Pro'da kod editöründe yaparsınız. Önizleme bir geliştirme sunucusu çalıştırdığı için yayımlanmış adresi kontrol edin. Statik ön yüzler yayımlandığında statik siteler olarak dağıtılır (statik web siteleri); bu, içerik sayfalarına uygundur. Sunucusu olan uygulamalar sıfıra ölçeklenir: boştayken uykuya geçer ve bir sonraki ziyarette uyanır; bu yüzden sessiz bir dönemden sonraki ilk istek daha yavaştır ve bağlı bir veritabanı 5 dakika boşta kaldığında uykuya geçer (barındırma sınırları). Bir genel sayfa yalnızca ilk ziyarette yavaşsa, muhtemel neden budur. Pazarlama sayfalarını statik tutmak yardımcı olur. Değişikliklerden sonra yeniden yayımlayın ve sayfayı sert yenileyin.

Sorular