Čo ste študovali o motore prehliadača?

Prehliadačový motor sa skladá z niekoľkých kľúčových komponentov:

• JavaScriptový motor — zodpovedá za analýzu a vykonávanie JS kódu. Napríklad V8 v Chrome, SpiderMonkey vo Firefoxu. Prekladá JS do strojového kódu a optimalizuje jeho vykonávanie.

• Renderovací motor (layout engine) — zodpovedá za analýzu HTML a CSS, tvorbu DOM a CSSOM, výpočet štýlov, layout (umiestnenie prvkov) a vykreslenie stránky. Príklad: Blink v Chrome, Gecko vo Firefoxu.

• Sieťová vrstva — spracováva HTTP požiadavky, načítanie zdrojov (HTML, CSS, JS, obrázky).

• Bezpečnosť — zahŕňa politiku rovnakého pôvodu (Same-Origin Policy), sandboxing, CORS, ochranu pred XSS a inými útokmi.

Práca motora začína načítaním HTML, tvorbou DOM, zatiaľ čo CSS a JS sa načítavajú paralelne. Po vytvorení DOM a CSSOM nasleduje layout a paint. JS motor môže ovplyvniť DOM, preto sa niekedy vykoná opakovaný layout.

Príklad zjednodušeného životného cyklu:

1. Načítanie HTML ->
2. Tvorba DOM ->
3. Načítanie a analýza CSS ->
4. Tvorba CSSOM ->
5. Spustenie JS, ktoré môže meniť DOM ->
6. Layout (výpočet rozmerov a pozícií) ->
7. Paint (vykreslenie) ->
8. Kompozícia (zostavenie vrstiev pre zobrazenie na obrazovke)

Tiež sa študujú optimalizácie, ako minimalizovať reflow a repaint, lazy loading, práca s cache a asynchrónne načítanie zdrojov.