Jest już dostępny, można testować.
Czym są te składniki serwera React?
Zespół frameworka React.js ogłosił właśnie wersję RFC (request for comments) React Server Components. O co tyle szumu w sieci? Wyobraź sobie komponenty React, które działają tylko na serwerze i nie mają żadnego wpływu na rozmiar pakietu po stronie klienta. Zerowy rozmiar pakietu. U klienta.
Komponenty serwera React pozwalają programistom tworzyć aplikacje obejmujące serwer i klienta, w sposób umożliwiający łączenie interaktywności aplikacji po stronie klienta z ulepszoną wydajnością tradycyjnego renderowania na serwerze. Może to być znaczna poprawa dla całego ekosystemu React, coś, co widzieliśmy już w Next.js.
Nauka React Server Components
Zanim pomyślisz o rozpoczęciu pracy z komponentami serwera React, powinieneś wiedzieć, że React Server Components jest nadal w fazie badań i rozwoju. Cytując autorów:
Dzielimy się tą pracą w duchu przejrzystości i aby uzyskać wstępne opinie od społeczności React.
Proponujemy zacząć od obejrzenia poniższego wykładu o komponentach serwera React autorstwa Dana Abramova, Lauren Tan, Josepha Savony i Sebastiana Markbåge.
Po obejrzeniu wykładu śmiało klonuj repozytorium z demo RSC aby samemu pobawić się z komponentami serwera React na swoim komputerze. Ponieważ możesz zechcieć przekazać swoją opinię zespołowi React Core to zdecydowanie warto poświęcić trochę czasu na przyjrzenie się aktualnemu stanowi komponentów serwera. Jest to aplikacja demonstracyjna zbudowana przy użyciu składników serwera, eksperymentalnej funkcji React. Oznacza to, że sam produkt nie jest jeszcze gotowy do wdrożenia i używasz go w swoich projektach na absolutnie własne ryzyko. Na razie zaleca się więc eksperymentowanie z komponentami serwera za pośrednictwem właśnie tej aplikacji demonstracyjnej.
Czytaj dokumentację
Dopiero teraz warto zapoznać się też z dokumentacją RFC dotyczącą składników serwera React. Najlepiej bowiem wpierw samemu zobaczyć jak komponenty serwera React się komunikują i pobawić się nimi. Repozytorium React.js RFCs zawiera wprowadzenie do React Server Components a na końcu znajduje się również niezła sekcja FAQ. Możesz również zapoznać się z powiązanym dokumentem RFC, aby przekazać opinię na temat konwencji nazewnictwa.
Co nam to daje?
Składniki serwera działają tylko na serwerze i nie mają żadnego wpływu na rozmiar pakietu. Ich kod nigdy nie jest pobierany do klientów, co pomaga zmniejszyć rozmiary pakietów i skrócić czas uruchamiania. Komponenty serwera mogą też uzyskiwać dostęp do źródeł danych po stronie serwera, takich jak bazy danych, systemy plików lub (mikro) usługi. Komponenty serwera bezproblemowo integrują się z komponentami klienta - czyli tradycyjnymi komponentami React. Komponenty serwera mogą ładować dane na serwerze i przekazywać je klientowi, umożliwiając mu renderowanie interaktywnych części strony.
Sprawdź oferty pracy na TeamQuest
Składniki serwera mogą przy tym dynamicznie wybierać, które składniki będą renderowane, co pozwala przymusić klienta do pobrania tylko minimalnej ilości kodu niezbędnej do renderowania strony. Co więcej, składniki serwera zachowują stan klienta po ponownym załadowaniu. Oznacza to, że stan klienta, aktywność, a nawet trwające animacje nie są zakłócane ani resetowane po refetchu drzewa komponentów serwera.
Składniki serwera są renderowane stopniowo a elementy interfejsu użytkownika są przyrostowo przekazywane do klienta. W połączeniu z Suspense, pozwala to programistom tworzyć zamierzone stany ładowania i szybko wyświetlać ważne treści, czekając na załadowanie pozostałej części strony.
Programiści mogą również udostępniać kod między serwerem a klientem, umożliwiając użycie pojedynczego składnika do renderowania statycznej wersji niektórych treści na serwerze na jednej trasie i edytowalnej wersji tej zawartości na kliencie inną trasą.
