Kiedy zaczyna się proces renderowania strony?

Proces renderowania strony zaczyna się, gdy przeglądarka otrzymuje i zaczyna przetwarzać dokument HTML. Proces ten obejmuje kilka etapów:

1. Parsowanie HTML: Tworzy się drzewo DOM (Model Obiektu Dokumentu).
2. Budowa CSSOM (Model Obiektu CSS): Parsuje się CSS stosowany do strony.
3. Budowa drzewa renderowania: DOM i CSSOM są łączone, aby utworzyć drzewo renderowania, zawierające elementy widoczne na stronie i ich style.
4. Layout (Obliczanie układu): Określane są geometria i pozycje każdego elementu na stronie.
5. Painting: Rysowanie pikseli elementów na ekranie.
6. Compositing (Kompozycja): Warstwy renderowanych elementów są łączone w końcowy obraz na ekranie.

Chociaż proces renderowania zaczyna się po stronie klienta (przeglądarki), jego uruchomienie jest wywoływane przez otrzymanie HTML, który często jest generowany dynamicznie na serwerze Node.js. Serwer odpowiada za przygotowanie i wysłanie początkowej odpowiedzi HTML.