Frontend
wpisy (18)
- Frontend Rendering: od server-side pages do hybrydowego renderowania7/17
SSG: renderowanie zanim pojawi się użytkownik
Build-time rendering zamienia koszt requestu na koszt builda. Płacimy raz, serwujemy tanio i zaczynamy mieć problem ze świeżością danych.
- Frontend Rendering: od server-side pages do hybrydowego renderowania6/17
Hydration: jak połączyć HTML z działającą aplikacją
Serwer wysyła wynik renderowania, nie aplikację. Browser musi odtworzyć drzewo komponentów i podpiąć je do istniejącego DOM-u.
- Frontend Rendering: od server-side pages do hybrydowego renderowania5/17
Powrót SSR: serwer znowu renderuje HTML
Serwer renderuje pierwszy widok nie po to, żeby frontend zniknął, tylko po to, żeby treść powstała wcześniej. Reszta kosztu zostaje na kliencie.
- Frontend Rendering: od server-side pages do hybrydowego renderowania4/17
Koszt wysyłania aplikacji do browsera
Transfer size to pierwszy koszt, nie jedyny. Liczy się praca, którą urządzenie musi wykonać, zanim aplikacja stanie się użyteczna.
- Frontend Rendering: od server-side pages do hybrydowego renderowania3/17
SPA i CSR: kiedy browser przejął aplikację
Browser pobiera dokument raz i sam zarządza przejściami między ekranami. Frontend przestaje być warstwą prezentacji, a staje się długowiecznym runtime'em.
- Frontend Rendering: od server-side pages do hybrydowego renderowania2/17
AJAX: moment, w którym strona zaczęła zachowywać się jak aplikacja
Request przestał oznaczać nawigację. Browser utrzymuje aktualny dokument i sam decyduje, co zrobić z odpowiedzią serwera.
- Frontend Rendering: od server-side pages do hybrydowego renderowania1/17
Server-rendered web: zanim frontend stał się aplikacją
Serwer składał pełny dokument dla każdego requestu, a browser był rendererem dokumentów. Model prosty, dopóki jednostką aktualizacji mógł być cały dokument.
- seria · 17 części
Frontend Rendering: od server-side pages do hybrydowego renderowania
Chronologia decyzji o tym, kiedy, gdzie i jak powstaje UI: od pełnego dokumentu z serwera po kompozycję builda, requestu, cache, streamingu i client runtime'u.