Bir adres yazıp Enter tuşuna bastığınızda tarayıcı önce hangi kaynağa, hangi protokolle erişeceğini belirler. Ardından sunucunun adresini bulur, bağlantı kurar ve bir HTTP isteği gönderir. Sunucunun döndürdüğü yanıt bir durum kodu, başlıklar ve bir gövde içerir. Tarayıcı bu yanıttaki HTML’i ayrıştırır, HTML’in işaret ettiği CSS, JavaScript ve görselleri ayrı istekler olarak alır, ardından sayfayı ekrana çizer. Aşağıda bu zincirin her halkasını, hangi koşulda atlanabildiğini ve nasıl ölçüldüğünü sırayla anlatıyoruz.
Adım adım: URL’den ekrandaki sayfaya
Aşağıdaki sıra, bir web sayfasının ilk kez açılmasını basitleştirilmiş biçimde gösterir. Gerçek tarayıcılar bu adımların bazılarını örtüştürebilir, bazılarını önbellek nedeniyle atlayabilir. Bu nedenle sırayı katı bir zaman çizelgesi değil, anlamak için bir çerçeve olarak okuyun.
As an Amazon Associate I earn from qualifying purchases.
1. URL, neyin istendiğini tarif eder
Bir URL, tarayıcıya üç temel bilgi verir: kullanılacak protokol (şema), hedef sunucu (ana bilgisayar adı) ve sunucu üzerindeki kaynağın yolu. Örneğin https://www.example.com/haberler?id=12 adresinde şema https, ana bilgisayar www.example.com, yol /haberler ve sorgu bölümü id=12 olarak okunur. Tarayıcı bu adresi tek başına bir “sayfa adı” olarak değil, bir kaynak isteği olarak işler. Adresin hangi bölümünün ne anlama geldiği için MDN’nin URL rehberine bakabilirsiniz.
Quick wins for a faster PC:
Repair Windows errors before they cause bigger problemsFix Now →Fix the driver behind crashes, sound loss and screen glitchesFind Drivers →Clear out junk files and repair common Windows errorsFree Scan →2. Alan adı IP adresine çevrilir (DNS)
İnsanlar alan adlarını, bilgisayarlar ise IP adreslerini kullanarak bağlanır. Tarayıcı, ana bilgisayar adını bir DNS çözümlemesiyle IP adresine çevirmeye çalışır. Bu çözümleme her gezintide yeniden yapılmak zorunda değildir: tarayıcı veya işletim sistemi daha önce aldığı sonucu bir süre saklayabilir. Bu yüzden tanıdık bir siteyi tekrar açtığınızda DNS adımı görünür bir gecikme yaratmayabilir.
#1 Best Overall
3. Bağlantı kurulur ve HTTPS ise güvenlik katmanı eklenir
Tarayıcı, IP adresi bilinen sunucuyla bir iletim bağlantısı kurar. Adres https ile başlıyorsa, veri alışverişinden önce tarayıcı ve sunucu güvenli aktarım için TLS görüşmesi yapar. MDN’nin web nasıl çalışır açıklaması bu katmanları genel çerçevede anlatır. Burada önemli bir ayrıntı var: kurulumun kaç mesajlaşmadan oluştuğu bağlantı türüne, protokol sürümüne ve daha önce kurulan bağlantıların yeniden kullanılıp kullanılmadığına göre değişir. Bu nedenle “önce şu, sonra bu” diye tek bir el sıkışma dizisi aramak yanıltıcı olur.
4. HTTP isteği gider, yanıt döner
Bağlantı hazır olduğunda tarayıcı bir HTTP isteği gönderir. İstek, hangi yöntemle (genellikle GET), hangi yolun istendiğini ve tarayıcının kim olduğu, hangi içerik türlerini kabul ettiği gibi başlıkları taşır. Sunucu da bir yanıt döndürür. Yanıtın başında bir durum kodu bulunur; ardından başlıklar ve gövde gelir. Gövde her zaman bir web sayfası değildir; bir görsel, bir JSON verisi ya da bir hata metni de olabilir. Bu istek-yanıt yapısının temel tanımı için MDN’nin istemci-sunucu açıklamasına bakabilirsiniz.
Rank #2
- Used Book in Good Condition
5. Tarayıcı yanıtı ayrıştırır, kaynakları ister ve sayfayı çizer
Gelen HTML, tarayıcı tarafından DOM adı verilen bir ağaca dönüştürülür. HTML içinde geçen CSS dosyaları, JavaScript dosyaları, görseller ve diğer kaynaklar için ayrı istekler başlar; bunlar da sunucudan gelir. Tarayıcı CSS’i işler, stilleri DOM ile birleştirir, öğelerin ekrandaki yerleşimini hesaplar ve son olarak pikselleri boyar. JavaScript çalıştığında belgeyi değiştirebilir; bu da yerleşimi ve boyamayı yeniden yaptırabilir. Bu aşamaların ayrıntılı akışı için MDN’nin tarayıcıların sayfayı nasıl oluşturduğu rehberine ve tarayıcıların web sitelerini nasıl yüklediğini anlatan sayfaya bakabilirsiniz. Kritik işleme yolunun daha teknik özeti için MDN’nin kritik işleme yolu sayfası uygundur.
Durum kodları: Yanıtın sonucu nasıl okunur?
Tarayıcı, sunucunun döndürdüğü her yanıtı önce durum koduna göre yorumlar. Aynı adres farklı koşullarda farklı kodlar döndürebilir, ve bir kodun gelmesi sayfanın içeriğinin doğru olduğu anlamına gelmez.
Rank #3
| Durum kodu | Anlamı | Tarayıcının kullanıcıya tipik yansıması |
|---|---|---|
| 200 | İstek başarılı, gövde yanıt olarak döndü | Gövde işlenir ve sayfa çizilir. Gövdenin beklediğiniz içerik olup olmadığı ayrıca kontrol edilmelidir. |
| 301, 302 gibi 3xx kodları | Kaynak başka bir adreste; tarayıcı yönlendirmeyi izler | Tarayıcı yeni adrese ikinci bir istek gönderir; adres çubuğundaki adres değişebilir. |
| 403 | Sunucu isteği reddetti; erişim izni yok | Genellikle erişim reddi sayfası gösterilir. |
| 404 | İstenen kaynak bulunamadı | Genellikle “sayfa bulunamadı” içeriği gösterilir; bu içerik sitenin kendi hata sayfası olabilir. |
Hızlandırmalar: Her gezintide olmayan kısayollar
Yukarıdaki akış, her şeyin sıfırdan yapıldığı bir ziyareti anlatır. Pratikte birkaç mekanizma bu süreyi kısaltabilir.
DNS önbelleği ve yeniden kullanılan bağlantılar
Daha önce çözümlenmiş bir alan adı, önbellekte bulunuyorsa DNS sorgusu tekrar yapılmayabilir. Aynı sunucuya yakın zamanda açılmış bir bağlantı da yeniden kullanılabilir; bu durumda yeni bağlantı kurulumu ve TLS görüşmesi gerekmez. Bu nedenle aynı sitede ikinci sayfaya geçiş, ilk ziyarete göre daha kısa sürebilir.
Spekülatif yükleme: Prefetch, preconnect ve prerender
Bazı sayfalar tarayıcıya gelecekte ihtiyaç duyulabilecek kaynakları önceden hazırlamasını söyleyebilir. Bunlar üç ana biçimde görülür:
Recommended Free Tools
- Preconnect: Bağlantının, daha sonra istek yapılacak bir sunucuyla önceden kurulmasını sağlar.
- Prefetch: Tahmin edilen bir kaynağın önceden indirilmesini sağlar; indirilen içerik yine kullanıma hazır beklemede tutulur.
- Prerender: Tahmin edilen bir sayfanın arka planda hazırlanmasını sağlar; kullanıcı o sayfaya geçtiğinde sonuç hemen gösterilebilir.
Bu yöntemler zorunlu adımlar değildir. Tarayıcı ya da site bunları bir tahmine dayanarak başlatır ve her ziyarette uygulanmaları beklenmez. Chromium’un prerender için yazdığı tasarım belgesi Chrome’un bu davranışını koşullara ve sezgisel kararlara bağlı olarak anlatır. Bu belge bir uygulama ayrıntısıdır ve tarihi eskidir; Chrome’un güncel davranışı için tarayıcının kendi sürüm notlarına bakmak gerekir.
Independent reader supportYour contribution helps us test, update, and keep practical guides available for everyone.Süreyi ölçmek: TTFB ve navigasyon zamanlamaları
Bir sayfanın ne kadar hızlı açıldığını konuşurken en sık geçen ölçümlerden biri TTFB’dir (Time to First Byte). TTFB, tarayıcının isteği gönderdiği andan yanıtın ilk baytını aldığı ana kadar geçen süreyi ifade eder. MDN, DNS çözümlemesi ve TCP/TLS bağlantı kurulumunun bu süreye katkıda bulunabileceğini belirtir; sunucunun yanıt üretme hızı da doğrudan etkilidir. Ayrıntı için MDN’nin TTFB sözlük maddesine bakabilirsiniz.
TTFB, sayfanın tamamen çizildiği ya da kullanıcı etkileşimine hazır olduğu anla aynı şey değildir. Tarayıcının bu evreleri ayrı ayrı görmek için güncel Performance Entry API’yi kullanabilirsiniz. MDN’nin navigasyon ve kaynak zamanlamaları rehberi bu alanların ne anlama geldiğini anlatır. Geliştirici araçlarının konsolunda ilk gezinti kaydını şöyle okuyabilirsiniz:
const [nav] = performance.getEntriesByType("navigation");
console.log("İstek başladı:", nav.requestStart);
console.log("İlk bayt geldi:", nav.responseStart);
console.log("Yanıt tamamlandı:", nav.responseEnd);| Alan | Neyi ölçer |
|---|---|
requestStart |
Tarayıcının isteği sunucuya göndermeye başladığı an |
responseStart |
Yanıtın ilk baytının alındığı an; TTFB’nin bitiş noktasıdır |
responseEnd |
Yanıtın son baytının alındığı an; HTML’in tamamının indirildiği anlamına gelir, sayfanın çizildiği anlamına gelmez |
Her ziyarette aynı olmayan noktalar
Bu anlatım, bir tarayıcının ve bir sunucunun birlikte yaptığı işin genel mantığını verir. Şu noktalarda gerçek davranış değişebilir:
- Önbellek, daha önce alınmış DNS sonucu veya bağlantı varsa ilgili adımlar atlanabilir ya da kısalabilir.
- Yönlendirmeler, sayfa açılmadan önce ek istekler ve ek gecikmeler ekler.
- JavaScript sayfanın içeriğini ilk HTML’den farklı hale getirebilir; bu yüzden “ilk yanıt” ile “ekranda gördüğünüz sayfa” her zaman aynı değildir.
- Tarayıcılar DOM, stil, yerleşim ve boyama adımlarını farklı sıralarla ya da örtüşerek yapabilir.
Bu nedenle bir sayfanın yavaş açıldığını tespit ettiğinizde, hangi evrenin gecikmeye yol açtığını ayırmak için yukarıdaki zamanlama alanlarına bakmak daha doğru bir başlangıç olur.
Quick Recap
Product prices and availability are accurate as of the date/time indicated and are subject to change. Any price and availability information displayed on Amazon at the time of purchase will apply.
