Hopp til hovedinnhold
Fag i Bekk/<ForrigeUke uke="20" ...<ForrigeUke uke="20" år="2025" ...

<ForrigeUke uke="20" år="2025" />

Publisert:21. mai

En del av:

ForrigeUke

<ForrigeUke /> er en artikkelserie som oppsummerer hva som skjedde i frontend-verden i uken som var.

React Server Components snart ute i React Router, Zod ute med lenge etterlengtet versjon og tips for å bli en magiker — i denne ukas ForrigeUke.

Dette var uka for å finne enklere måter å dele hemmeligheter med teamet 🤫og nyttige code reviews 🐯— og 1177 ting som skjedde i frontendverdenen!

«<ForrigeUke /> er en artikkelserie som oppsummerer hva som skjedde i frontend-verden i uken som var.»

Snart RSC i React Router?

React Server Components (RSC) er et "paradigmeskifte" i React hvor det skal være mulig å ha komponenter og funksjoner som kjører utelukkende på serveren. Men, det som er litt spesielt med denne delen av React er at det ikke faktisk er en del av React!

RSC er nemlig en del av React som hvert meta-rammeverk må implementere selv, og så langt har det bare vært Next.js som har vært på ball her. Grunnen til dette er at Vercel, gjennom Next.js-teamet, har vært tett knyttet til utviklingen bak denne funksjonen, og Next.js ble dermed en naturlig prøvekanin for denne nye måten å skrive React-applikasjoner på. RSC har faktisk vært ute og tilgjengelig for bruk i produksjon i Next.js i litt over 2 år!

React Router har derimot ikke hatt de samme mulighetene. De har lenge jobbet med sin implementasjon av React Server Components i React Router, men har blant annet vært stoppet av at det ikke fantes noen offentlige Vite-plugins fra React-teamet som kunne brukes for å bundle React Server Components. Det har faktisk bare vært Webpack-plugins tilgjengelig så langt!

Tidligere i år endret heldigvis dette seg. Parcel fikk i versjon 2.14 ut beta-støtte for RSC. Dette har gjort det mulig for React Router å nå kunne rulle ut en preview-versjon av RSC i React Router! React Router er derimot Vite-basert, så vi må nok vente enda litt lenger før vi får en stabil versjon av React Router med RSC, men vi kan i alle fall nå få en liten forsmak på hvordan dette vil fungere!

Ryan Florence har skrevet en liten bloggpost på Remix sin blogg om preview releasen av RSC i React Router, så om du er interessert i å se hvordan RSC vil se ut i React Router kan jeg på det sterkeste anbefale å ta en titt!

Jeg synes RSC er en veldig spennende teknologi, så det er gledens dag å endelig kunne grave litt i hvordan React Router-teamet har valgt å implementere dette! Ryan Florence, forfatter av React Router, har lenge vært kritisk til en del av designvalgene rundt Next.js sin implementasjon, som for eksempel at Server Functions eksekveres sekvensielt, så det er ikke overraskende å se at Server Functions i React Router kjører i parallell.

Skjermbilde av en applikasjon, "RSC Movies", hvor tre filmer er fjernet fra "favoritter". I nettverksfanen kan vi se tre nettverkskall som går samtidig til serveren.
I demo-applikasjonen, RSC Movies, ser vi tydelig at server actionen for å legge til/fjerne filmer som favoritt kjører i parallell.

Zod v4 ute i v3.25

Zod, et av de mest populære skjemavalideringsbibliotekene på markedet, har nylig kommet ut med en del store, etterlengtede, endringer i versjon 4.

Listen over forbedringer er lengre enn jeg kan huske å ha sett i andre lignende leveranser, så her er det helt klart mye å kose seg med! Blant annet får Zod 4 skinne i rampelyset med ytelsesforberedelser som

  • 14x raskere string parsing,
  • 7x raskere array parsing, og,
  • 6.5x raskre object parsing!

Ikke nok med det, så har også TypeScript-ytelsen blitt betydelig raskere! Noen litt mer kompliserte Zod-skjemaer fører i nyeste versjon til så mye som 100x færre type-instansieringer! 🤯Jeg har lenge irritert meg over hvor treig editoren min blir hvis jeg har litt for vanskelige Zod-skjemaer, så forhåpentligvis vil dette gjøre utvikleropplevelsen min en del bedre 🤞

Skjermbilde av kunngjøringen til Zod v4 hvor de viser en kodesnutt som har blitt betraktelig enklere.
Denne kodesnutten førte tidligere til 25 000 type-instansieringer, nå er det bare ca. 175

Så hvis du nå var klar til å gå rett i package.json og endre versjonen på Zod til 4.0.0 vil du nok fort bli skuffet, for den versjonen er ikke ute enda... Zod har valgt å gå for en litt utradisjonell (men veldig fornuftig) versjoneringsstrategi der de heller slipper endringene ut gjennom en ny minor-versjon, 3.25. Dette har Collin McDonnell skrevet litt om i et GitHub issue. Kort oppsummert er dette for å lette migreringsjobben for brukere av Zod. Det de har gjort er at de slipper ut de nye endringene, sammen med den gamle versjonen, og lar de leve side om side. Det betyr at du i dag kan bytte ut alle importene dine med "zod/v4" for å ta i bruk nyeste versjon. Hvis du derimot har noen avhengigheter som ikke har kommet seg over på siste versjon, kan du i de tilfellene bare importere Zod som vanlig.

Du kan lese mer om Zod v4, og alle de kule endringene som har kommet ut i kunngjøringsposten deres!

For en uke! 🔥 La oss håpe vi får like mye kult denne uken også! 🤞Vi ses igjen neste uke 👋

Del kunnskapen

Har du en kollega som også hadde dratt nytte av denne artikkelen?

Mer fra Fag i Bekk

Nå er du ved veis ende. Gå til forsiden hvis du vil ha mer faglig påfyll.

Til forsiden