React 19 przesuwa granicę między serwerem a klientem na poziom komponentu: to co nie wymaga interakcji nie wysyła JavaScriptu do przeglądarki w ogóle. Server Actions eliminują API routes dla mutacji, automatyczna memoizacja eliminuje useCallback — ponad 150 slice'ów w MazCode, zero ręcznej optymalizacji re-renderów.
Przez 10 lat React był biblioteką kliencką. Komponent = JavaScript pobierany do przeglądarki, uruchamiany w przeglądarce, renderujący HTML w przeglądarce. Każdy komponent — nawet statyczna stopka z adresem — lądował w bundle'u i wymagał hydratacji. Przy aplikacji z setkami komponentów to 300–500 kb JS do zparsowania zanim cokolwiek stało się interaktywne.
Server Components odwracają ten model na poziomie ziarnistości komponentu. `async function Hero()` może bezpośrednio wywołać `db.query()` albo `fs.readFile()` — serwer zwraca gotowy HTML, do przeglądarki nie trafia żaden kod tego komponentu. `'use client'` to opt-in, nie default. W moim codebase ponad 150 slice'ów, spośród których statyczne sekcje treści, nagłówki, stopki, siatki usług — wszystkie to czyste RSC. Client bundle dla typowej strony informacyjnej jest wielokrotnie mniejszy niż przy klasycznej architekturze klienckiej — statyczne sekcje nie wysyłają JS w ogóle.
Server Actions eliminują jedną z największych bolączek DX w architekturze web: API routes jako boilerplate dla każdej mutacji. Formularz kontaktowy wcześniej: komponent client-side, event handler, fetch do `/api/contact`, walidacja w dwóch miejscach, obsługa błędów w dwóch miejscach. Z Server Actions: jeden plik, jedna funkcja `async` z dyrektywą `'use server'`, pełne type safety, automatyczne progressive enhancement. Zapis formularza działa nawet bez JS w przeglądarce.
Suspense boundaries to mechanizm granularnej kontroli loading state na poziomie drzewa komponentów. Zamiast jednego globalnego spinnera dla całej strony, każdy fragment danych ma własny fallback. Strona klienta z dynamiczną sekcją opinii i statycznym contentem: shell strony ładuje się błyskawicznie z SSG, sekcja opinii streamuje się asynchronicznie z własnym loading state — bez blokowania renderowania reszty.
useTransition i useDeferredValue z concurrent features Reacta dają precyzyjną kontrolę nad priorytetem aktualizacji stanu. Ciężkie operacje — filtrowanie dużej listy, aktualizacja złożonego widoku — można oznaczyć jako non-urgent, żeby React nie blokował pilniejszych aktualizacji UI. Efekt: 60fps nawet przy operacjach, które wcześniej powodowały lag na słabszych urządzeniach.
React Compiler (stabilny w React 19) automatycznie dodaje memoizację tam gdzie wcześniej developer musiał ją dodawać ręcznie. useCallback, useMemo, React.memo — dla większości przypadków zbędne. Compiler analizuje drzewo komponentów i wnioskuje gdzie re-render jest nieunikniony, a gdzie można go bezpiecznie pominąć. W praktyce: mniej kodu, mniej miejsc gdzie można zepsuć optymalizację przez błędne dependency array.
Dla klienta biznesowego to przekłada się bezpośrednio: mniejszy bundle to szybszy FCP, szybszy FCP to niższy bounce rate, niższy bounce rate to wyższy współczynnik konwersji. Google PageSpeed Insights uwzględnia wszystkie trzy metryki jako sygnał rankingowy. Strona zbudowana na RSC architecture z poprawnie ustawionymi Suspense boundaries osiąga wysokie wyniki Core Web Vitals bez sztuczek.
Komponenty z bezpośrednim dostępem do bazy danych i systemu plików — HTML generowany na serwerze, żaden kod komponentu nie trafia do bundle'a klienta. W MazCode większość drzewa komponentów to RSC — kod tych komponentów nie trafia do bundle'a klienta, więc jest on znacząco mniejszy.
Funkcje `async` z dyrektywą `'use server'` wywoływane bezpośrednio z formularzy — walidacja Zod, zapis do bazy, rewalidacja cache w jednym miejscu. Progressive enhancement działa nawet bez JS w przeglądarce.
Każdy fragment drzewa komponentów ma własny fallback i własny cykl życia asynchronicznego. Shell strony ładuje się z SSG, dynamiczne sekcje streamują się niezależnie — LCP nie czeka na najwolniejszy fetch.
useTransition oznacza aktualizacje stanu jako non-urgent — React nie blokuje renderowania krytycznych elementów UI podczas ciężkich operacji. useDeferredValue throttluje drogie obliczenia bez utraty responsywności interfejsu.
ponad 150 gotowych slice'ów z RSC architecture: lekki bundle, LCP w okolicach 1.2s, zero boilerplate dla formularzy i mutacji. Komponent renderuje się na serwerze albo na kliencie — zależnie od tego gdzie ma sens, nie gdzie jest wygodniej.