Πώς λειτουργεί ο περιηγητής;

Ο περιηγητής λαμβάνει το ζητούμενο URL, το αναλύει και στέλνει ένα αίτημα HTTP στον διακομιστή. Ο διακομιστής επεξεργάζεται το αίτημα και στέλνει μια απάντηση που περιέχει HTML, CSS, JavaScript, εικόνες και άλλους πόρους.

Ο περιηγητής αναλύει το έγγραφο HTML, δημιουργώντας το δέντρο DOM (Document Object Model).

Στη συνέχεια, επεξεργάζεται το CSS και κατασκευάζει το δέντρο CSSOM (CSS Object Model).

Με την ένωση του DOM και του CSSOM, ο περιηγητής δημιουργεί το δέντρο απόδοσης (Render Tree), που περιέχει τα στοιχεία που θα εμφανιστούν, μαζί με τα στυλ τους.

Η φάση Layout (ή Reflow) υπολογίζει τις γεωμετρικές παραμέτρους κάθε στοιχείου (θέση, διαστάσεις).

Στη φάση Painting (ή Repainting), ο περιηγητής σχεδιάζει τα ορατά στοιχεία στην οθόνη, χρησιμοποιώντας τις πληροφορίες από το Render Tree και το Layout.

Αν υπάρχει JavaScript, ο περιηγητής το φορτώνει και το εκτελεί. Το JavaScript μπορεί να τροποποιήσει το DOM και το CSSOM, κάτι που μπορεί να προκαλέσει επαναληπτικές φάσεις Layout και Painting.

Ο περιηγητής αποθηκεύει στην cache τους πόρους που λαμβάνει, για να επιταχύνει τις επόμενες φορτώσεις.