Tarayıcılar Nasıl Çalışır ? (Chrome, Edge, Firefox vb..)
Son Güncellenme Tarihi: 04.07.2023 ©Copyright: Onur Dayibasi
Tarayıcıların çalışmasını derinlemesine inceleyerek kullanıcının web sayfasını gezerken, veya bir web uygulamasını kullanırken arka planda neler döndüğünü , hangi işlemler yapıldığını bilmek Frontend Developer için çok önemlidir.
Çünkü geliştirdiğimiz tüm Web Uygulamaları bu platformlar üzerinden sunulur, Daha Kaliteli ve Hızlı uygulamalar geliştirmek için tarayıcıların iç yapısını bilmeniz gerekir.
Tarayıcılar Nedir, Ne İşimize Yarar ?
- Tarayıcının Ana Fonksiyonu
- Tarayıcının Ana Elemanları
İşletim Sistemi , CPU, GPU, Bellek
- Concurrency vs Paralel
- İşlemci(CPU) hangi işlemi önce yapacağına nasıl karar verir ?
- Process vs Thread
- Senkron vs Asenkron (Sync/Async)
- Ekran Kartı Nasıl Çalışır (GPU)
- Ekran Kartının İç Yapısı
- Vertex Shader
- Pixel Shader
- İşletim Sistemi Nasıl Çalışır ?
- Amaçları Nelerdir ?
- Bilgisayar Sistemi İçerisindeki Yeri Nedir ?
- İşletim Sisteminin Hangi Bölümlerden Oluşur ? Tarayıcılar İşletim Sistemi ve Donanımı Nasıl Kullanıyor
Mimari Yapı, Process Türleri ve İletişim
- Process ve Türleri
- Multi-Process Mimarinin Avantajı
- Site Isolation
Routing — Navigasyon Nasıl Gerçekleşiyor ?
- Basitçe Yönlendirme
- Adres Çubuğuna Arama Kelimesi veya URL yazılır
- UI Thread Bunun Bir URL olup Olmadığına Karar Verir.
- Navigasyon Başlar
- Response Veri Okunmaya Başlar
- Renderer Process’e Veriyi Aktarma
- Navigasyon İşleminin Onaylanması
- Initial Load (HTML, CSS) Yüklenmesinin Tamamlanması
- Başka Bir Sayfaya Yönlendirme
- Basitçe Yönlendirme
Rendering - Web Sayfası Ekrana Nasıl Çizilir ?
- Rendering & JS Engine
- Ana Akış
- Parsing
- DOM Oluşturulması
- JS Updates
- Style Calculation (Render Ağacı Oluşturma) Layout
- Paint
- Compositing
Input - Kullanıcı Etkileşimi Nasıl Yönetilir ?
- Event Target(Olay Hedefini) Bulmak
JavaScript - Nasıl İşletilir (Basit Anlatım)
- JS Nasıl İşletilir ?
- Bellek Kullanımı (Stack vs Heap)
- Call Stack Nasıl Çalışır
- Tarayıcı Asenkron Nasıl Çalışır? (WebAPIs, EventLoop ve TaskQueue) 7. JavaScript -
Nasıl İşletilir (Detaylı Anlatım)
- Tarayıcılara Göre JS Engine İncelediğimizde
- JS Engine Ana Akış
- JS Engine ’de Object Model ?
- Property Attributes
- JS Engine ’de Array ?
- Object Aynı Şekle Sahip ise Bellekte Nasıl Tutuluyor ?
- Object Hangi Shape Üzerinden Oluşturulacağını nasıl Biliyor ? J
- S Engine Obj Prop
- Erişirken Kısayol Ezberi Oluşturur.
Referanslar
Yukarıdaki konularda bilgi sahibi olmak için LearnReactUI.dev ücretsiz üye olup, bu E-Kitaptan faydalanabilirsiniz.