Kā pārlūkprogramma parsē HTML failu?

Pārlūkprogramma lasa HTML failu pa bytei. Balstoties uz faila kodējumu, tiek veidots rakstzīmju plūsma. Šī plūsma tiek parsēta, veidojot tokenus (atveršanas un aizvēršanas tagu, tekstu, komentāru, doctype). Tokeni tiek pārvērsti mezglos (nodes), kas tiek sasaistīti koka formā — Document Object Model (DOM).

Parsēšanas process notiek šajos posmos:

Baitu lasīšana: Pārlūkprogramma saņem baitu plūsmu.
Kodējuma noteikšana: Nosaka faila kodējumu (piemēram, UTF-8, Windows-1251). Tas var notikt caur HTTP galvenes, <meta> tagiem vai automātiski.
Simbolu pārvēršana: Baiti tiek pārvērsti simbolos atbilstoši noteiktajam kodējumam.

Tokenizācija: Rakstzīmju plūsma tiek sadalīta tokenos.

<!-- Tokenu piemērs -->
<p> // Tokens: atverošā zīme "p"
  Sveiki, // Tokens: teksts "Sveiki, "
  pasaule! // Tokens: teksts "pasaule!"
</p> // Tokens: aizverošā zīme "p"

AST (DOM koka) būvēšana: Balstoties uz tokenu secību, tiek būvēts mezglu koks (DOM). Pārlūkprogramma uztur atvērto zīmju steku; sastopoties ar aizvēršanas zīmi, tā aizver atbilstošo atvēršanas zīmi no steka un pievieno tās mezglu kokam.

<!-- Vienkārša DOM struktūra -->
<!DOCTYPE html>
<html>
  <head>
    <title>Piemērs</title>
  </head>
  <body>
    <p>Teksts</p>
  </body>
</html>

// DOM koks būs ar struktūru, kas atspoguļo iekšējo zīmju iekļaušanu.
// Piemēram, "p" mezgls būs "body" mezgla bērns.

Skriptu un stilu parsēšana: Analizējot HTML, pārlūkprogramma sastop <script> un <link>/<style> zīmes:
- <script>: Sākotnēji HTML parsēšana tiek pārtraukta, skripts tiek ielādēts, parsēts un izpildīts. Pēc izpildes HTML parsēšana atsākas. async un defer atribūti maina šo uzvedību. async izpilda skriptu asynchrone, neapturot parsēšanu. defer atliks skripta izpildi līdz HTML parsēšanas beigām.
- <link> / <style>: CSS tiek parsēts paralēli ar HTML un veido CSS Object Model (CSSOM). <link> klātbūtne pirms <script> var kavēt skripta izpildi, jo pārlūks var gaidīt CSSOM izveidi, lai nodrošinātu pareizu stilu piemērošanu pirms skripta izpildes.