Браузердин кыймылдаткычы боюнча эмне үйрөндүңүз?

Браузердин иштөө механизми бир нече негизги компоненттерден турат:

• JavaScript иштеткич — JS кодун талдоо жана иштетүү үчүн жооптуу. Мисалы, Chromeда V8, Firefoxта SpiderMonkey. Ал JS'ни машиналык кодго которуп, анын иштешин оптималдаштырат.

• Render мотору (layout engine) — HTML жана CSS'ти талдоо, DOM жана CSSOM түзүү, стили эсептөө, layout (элементтердин жайгашуусу) жана баракчаны чийүү үчүн жооптуу. Мисалы, Chromeда Blink, Firefoxта Gecko.

• Тармак катмары — HTTP суроолорун иштетет, ресурстарды жүктөө (HTML, CSS, JS, сүрөттөр).

• Коопсуздук — Same-Origin Policy, sandboxing, CORS, XSS жана башка чабуулдарга каршы коргоо.

Мотордун иши HTML жүктөлгөндөн баштап башталат, DOM түзүлөт, ал эми CSS жана JS параллелдүү жүктөлөт. DOM жана CSSOM түзүлгөндөн кийин layout жана paint жүргүзүлөт. JS иштеткич DOM'го таасир эте алат, ошондуктан кээде кайра layout жасалат.

Жөнөкөй циклдин мисалы:

1. HTML жүктөө ->
2. DOM түзүү ->
3. CSS жүктөө жана талдоо ->
4. CSSOM түзүү ->
5. JS иштетилет, ал DOM'ду өзгөртүшү мүмкүн ->
6. Layout (өлчөмдөр жана жайгашуулар эсептелет) ->
7. Paint (чийүү) ->
8. Композиция (катмаларды топтоо экранга көрсөтүү үчүн)

Ошондой эле, reflow жана repaint минималдаштыруу, lazy loading, кэш менен иштөө жана ресурстарды асинхрон жүктөө сыяктуу оптималдаштыруу иштерин үйрөнүшөт.