Vercel wydało Next.js 16.3, wprowadzając Turbopack i Partial Prerendering z fazy eksperymentalnej do trybu gotowego do użytku produkcyjnego. Aktualizacja obiecuje budowanie aplikacji dwa do pięciu razy szybciej w przypadku średniej wielkości projektów oraz skrócenie czasu Time to Interactive (TTI) o 40–60% — co zauważy każdy zespół goniący terminy przy wdrażaniu nowych funkcji.

Dlaczego ta zmiana jest teraz istotna

Next.js od dawna opierał się na Webpacku, bundlerze JavaScript napisanym w JavaScript, zarówno podczas budowania w trybie deweloperskim, jak i produkcyjnym. W ciągu ostatniego roku zespół Vercel dopracował Turbopack — oparty na Rust zamiennik, który zmniejsza zużycie pamięci i przyspiesza proces budowania. Jednocześnie testowano Partial Prerendering (PPR) jako sposób na łączenie statycznego HTML z dynamiczną treścią generowaną w locie, ale programiści musieli traktować to jako „eksperyment wymagający dobrowolnego włączenia”. Promując oba rozwiązania jako stabilne, Vercel daje zespołom produkcyjnym gotową aktualizację wydajności bez konieczności stosowania metody prób i błędów.

Turbopack staje się stabilny

  • Szybkość: Budowanie produkcyjne w średniej wielkości repozytoriach przebiega teraz dwa do pięciu razy szybciej.
  • Pamięć: Zmniejsza obciążenie pamięci w dużych bazach kodu.
  • Aktywacja: Dodaj turbo: true do next.config.js i gotowe.

Ceną za to jest bardziej rygorystyczne środowisko. Turbopack wymaga Node 18.17 lub nowszej wersji, a niestandardowe wtyczki Webpack, na których polegają projekty, nie będą działać w Turbopacku. Zespoły korzystające z rozbudowanych potoków wtyczek muszą przeprowadzić audyt lub przepisać te rozszerzenia przed przełączeniem trybu.

Server Actions działają płynniej

Server Actions — funkcje działające na serwerze, ale wywoływane z klienta — zyskały teraz ściślejszą integrację z TypeScriptem. Kompilator automatycznie wnioskuje typy, dzięki czemu programiści mogą zrezygnować z ręcznego dopisywania adnotacji typów. Rozwiązanie to rozumie również zagnieżdżone obiekty i schematy Zod od początku do końca (end-to-end), co redukuje błędy podczas działania aplikacji. Nowe konwencje systemu plików sprawiają, że rozwiązywanie akcji jest jawne, co pomaga programistom unikać subtelnych błędów spowodowanych niejednoznacznymi importami.

Partial Prerendering (PPR) jest gotowy do produkcji

PPR pozwala pojedynczej stronie serwować statyczny HTML dla części, które nigdy się nie zmieniają, przy jednoczesnej oddzielnej hydratacji sekcji dynamicznych. Statyczny znacznik renderuje się natychmiast; następnie pobieranie w tle ożywia interaktywne elementy. Podejście to poprawia wskaźnik Time to Interactive (TTI) o 40–60%.

Wdrożenie PPR jest proste: oznacz statyczne fragmenty za pomocą istniejącego API generowania statycznego, a dynamiczne elementy pozostaw do renderowania po stronie klienta. Ponieważ statyczny HTML trafia do przeglądarki jako pełny dokument, przeglądarka może rozpocząć renderowanie, zanim jakikolwiek kod JavaScript zostanie uruchomiony, co zwiększa postrzeganą wydajność w wolnych sieciach.

Inne istotne usprawnienia

  • Optymalizacja obrazów: Można teraz ustawić fetchPriority dla obrazów LCP (Largest Contentful Paint), co zapewnia, że przeglądarka najpierw pobierze obraz główny (hero image).
  • Obsługa czcionek: next/font automatycznie tworzy podzbiory znaków, zmniejszając rozmiar przesyłanych danych bez dodatkowej konfiguracji.
  • Middleware: Silnik dopasowywania został przepisany w Rust, co zapewnia szybsze sprawdzanie tras. Middleware może również zwracać pełne odpowiedzi HTML, co otwiera drogę do stron renderowanych na brzegu sieci (edge-rendered).

Natychmiastowe kroki dla zespołów

  1. Włącz Turbopack w trybie deweloperskim; działa on tak samo w produkcji po ustawieniu flagi turbo.
  2. Zaktualizuj Node do wersji 20 lub wyższej.
  3. Przejrzyj Server Actions pod kątem korzyści z wnioskowania typów; usuń wszelkie ręczne adnotacje, które są już zbędne.
  4. Przeprowadź pilotaż Partial Prerendering na pojedynczej trasie o dużym natężeniu ruchu, aby zmierzyć poprawę TTI przed wdrożeniem w całym serwisie.

Uwagi i zastrzeżenia

Zyski wydajnościowe zależą od spełnienia nowych wymagań środowiska uruchomieniowego. Projekty korzystające ze starszych wersji Node lub mocno oparte na niestandardowych wtyczkach Webpack napotkają trudności.

Podsumowując: Next.js 16.3 dostarcza programistom bundler klasy produkcyjnej oparty na Rust oraz sprawdzoną metodę łączenia treści statycznych i dynamicznych. Przyjmij nowe ustawienia domyślne już teraz, napraw luki w kompatybilności, a zobaczysz, że procesy budowania kończą się szybciej, a strony stają się wyraźnie bardziej responsywne dla użytkowników końcowych.