Sobes.tech
Middle

Kullanıcı için sitenin render edilmesi nasıl gerçekleşir?

sobes.tech yapay zeka

AI'dan gelen yanıt

  1. Kullanıcı URL'yi tarayıcıya girer. Tarayıcı, sunucunun IP adresini almak için DNS isteği gönderir.
  2. Tarayıcı, sunucu ile TCP bağlantısı kurar. Genellikle HTTP/S protokolü kullanılır.
  3. Tarayıcı, sunucuya HTTP isteği gönderir. HTML belgesi ve diğer kaynaklar (CSS, JavaScript, resimler) talep edilir.
  4. Sunucu, isteği işler ve HTTP yanıtı gönderir. Yanıt, istenen kaynakları ve durum bilgilerini içerir.
  5. Tarayıcı, HTML belgesini alır. HTML'nin ayrıştırılması başlar.
  6. DOM (Document Object Model) oluşturulur. HTML yapısını temsil eden nesne ağacı.
  7. Tarayıcı, HTML'de dış kaynaklara (CSS, JavaScript, resimler) bağlantıları tespit eder. Ek istekler yapılarak alınır.
  8. Tarayıcı, CSS stillerini alır. CSS'nin ayrıştırılması başlar.
  9. CSSOM (CSS Object Model) oluşturulur. Stilleri temsil eden nesne ağacı.
  10. Render Ağacı oluşturulur. DOM ve CSSOM'un birleşimi. Sadece görünür öğeleri ve stillerini içerir.
  11. Layout (veya Reflow). Sayfadaki her öğenin geometrik boyutları ve konumu hesaplanır.
  12. Paint (veya Repaint). Öğeler, stillerine ve konumlarına göre ekranda çizilir.
  13. Bileşim. Sayfa katman katman düzenlenerek kullanıcıya gösterilir.
  14. Tarayıcı, JavaScript dosyalarını alır. Kodun ayrıştırılması ve yürütülmesi başlar. JavaScript, DOM ve CSSOM'u değiştirebilir, bu da Layout ve Paint'in yeniden hesaplanmasına neden olur.
  15. Sayfa, kullanıcıya gösterilir. Kaynaklar alındıkça ve adımlar tamamlandıkça, kullanıcı sayfa içeriğini görür.