Tarayıcı web sayfasını nasıl işler?

URL Analizi: Tarayıcı, URL'yi analiz ederek protokolü, alan adını ve kaynağa giden yolu belirler.
DNS isteği: Eğer alan adı yerel önbellekte değilse, tarayıcı DNS isteği göndererek sunucunun IP adresini alır.
TCP bağlantısı kurma: Tarayıcı, alınan IP adresiyle sunucuya TCP bağlantısı kurar.
HTTP isteği: Tarayıcı, istenen web sayfasını talep eden HTTP isteği gönderir.
HTTP yanıtını alma: Sunucu, isteği işler ve HTML kodu, CSS, JavaScript ve diğer kaynakları içeren HTTP yanıtını gönderir.
HTML çözümleme: Tarayıcı, alınan HTML'yi çözümlemeye başlar ve DOM ağacını (Document Object Model) oluşturur.
Kaynakların yüklenmesi: HTML çözümlemesi sırasında, tarayıcı diğer kaynaklara (CSS, JS, resimler) bağlantıları tespit eder ve bunları paralel olarak yüklemeye başlar.
CSS çözümleme: Tarayıcı, CSS'i analiz eder ve CSSOM (CSS Object Model) ağacını oluşturur.
Render Ağacının oluşturulması: DOM ve CSSOM'un birleşimiyle, tarayıcı yalnızca görünür düğümleri ve stillerini içeren render ağacını oluşturur.
Yerleşim (Layout): Tarayıcı, her öğenin sayfadaki geometrik boyutlarını ve konumunu hesaplar.
Çizim (Painting): Tarayıcı, render ağacı ve yerleşim sonuçlarına dayanarak ekran üzerinde her öğe için piksel çizer.
Bileşim (Compositing): Sayfa katmanlar içeriyorsa (örneğin, transform veya opacity gibi CSS özellikleri nedeniyle), tarayıcı bu katmanları birleştirerek nihai resmi gösterir.
JavaScript işleme: <script> etiketleri veya satır içi betikler tespit edildiğinde, tarayıcı JavaScript'i analiz eder, derler ve çalıştırır. JavaScript, DOM ve CSSOM'u değiştirebilir ve yerleşim ve çizim aşamalarını etkileyebilir, bu da bu adımların tekrar edilmesine neden olabilir.