Web vizualizatsiyalari

HTML yozsangiz brauzer
ichida nima bo'ladi?

Kod yozishdan ekranda ko'rinishigacha — har bir qadam alohida, chuqur animatsiya bilan tushuntiriladi.

01

HTML Parsing

→

02

DOM Tree

→

03

CSS & CSSOM

→

04

Render Pipeline

→

05

JS Engine

Barcha mavzular

MAVZU 01 · HTML

Brauzer HTML faylni qanday o'qiydi? Bytes → Characters → Tokens — Tokenizer FSM animatsiyada.

Bytes UTF-8 Tokenizer FSM Parser

MAVZU 02 · DOM

Tokenlardan Node yaratiladi va daraxt quriladi. Document, Element, Text — har bir tugun nima?

Node Element Document Tree innerHTML

MAVZU 03 · CSS

CSS qanday parse qilinadi? Cascade, specificity, computed style — CSSOM daraxt qanday quriladi.

CSSOM Cascade Specificity Computed Style

MAVZU 04 · RENDER

Render Pipeline

Render Tree, Layout (reflow), Paint, Composite — piksel ekranda qanday paydo bo'ladi.

Render Tree Layout Paint GPU 60fps

JS Engine & Event Loop

V8 JS ni qanday bajaradi? Call Stack, Web APIs, Callback Queue, Microtask — async qanday ishlaydi.

V8 Call Stack Event Loop Promise async/await