<ForrigeUke uke="51" år="2025" />
Tjøl Ravndal kommer med tips til hvordan du kan bli mer fornøyd med TypeScript-kodebasen din, Next.js ute med ny minor-versjon, og et nytt bibliotek for enklere databasespørringer – i denne ukas ForrigeUke.
Dette var uka for uautorisert adgang 🦆, hacking på lavt nivå 🚨 – og 942 ting skjedde i frontend-verdenen.
«<ForrigeUke /> er en artikkelserie som oppsummerer hva som skjedde i frontend-verden i uken som var.»
Julegavetips til kodebasen din 🎁
Vår egen Tjøl Ravndal har skrevet en kort artikkel om hvordan satisfies kan gjøre deg enda mer fornøyd med TypeScript. Kort fortalt kan du se på satisfies som et alternativ til tradisjonelle typeannoteringer.
Vanlige typeannoteringer gir god strukturell typekontroll, men ofte på bekostning av at vi mister informasjon om den konkrete typen. Hvis vi for eksempel annoterer en variabel som Record<string, number>, får vi hjelp av TypeScript til å sikre at nøklene er strenger og verdiene tall. Samtidig mister vi informasjon om hvilke spesifikke nøkler og verdier objektet faktisk inneholder.
Ved å bruke satisfies Record<string, number> blir vi fortsatt tvunget til å oppfylle kontrakten til Record<string, number>, men vi beholder samtidig den mer presise typen til det underliggende objektet – inkludert konkrete nøkler og verdier.
Nyttig, ikke sant? Dette, og flere tips til hvordan du kan forbedre kodebasen din med satisfies, kan du lese om i luke 18 av adventskalenderen til Bekk 👇🏻🎅🏻
Enda mer fornøyd med TypeScript satisfies
Slutt å velge mellom typesikkerhet og inferens i TypeScript. Med satisfies får du begge deler – her er hvordan.
Next dev ble akkurat raskere ⚡️
Next.js slapp denne uka en ny minor-versjon, 16.1. Og ja … Det er ikke sånn veldig mye å rope hurra for, men det har likevel sneket seg inn noen nye ting. Kort oppsummert består releasen av fire nyheter:
- Turbopack file system caching for
next dev - Next.js Bundle Analyzer (eksperimentell)
- Litt enklere debugging
- Transitive eksterne avhengigheter i
serverExternalPackages
Det de fleste nok kommer til å merke mest (spesielt i litt større kodebaser) er at next dev starter raskere enn før. Turbopack, Vercels nye bundler, har nemlig begynt å cache'e mer av arbeidet sitt på disk. Det betyr at når du starter dev-miljøet på nytt, slipper den å begynne helt fra scratch. I stedet kan den plukke opp tidligere kompileringsartefakter fra disken og få en liten tjuvstart.
Ifølge releasenotatene skal dette kunne gi en oppstart som er et sted mellom 5 og 10 ganger raskere. Hos meg var forbedringen litt mer beskjeden: rundt 2x, fra 2,7 sekunder til 1,3. Men så er det mulig kodebasen min er litt for snill til å være et veldig representativt benchmark.
Next.js 16.1
Next.js 16.1 introduces Turbopack file system caching for development, a new bundle analyzer, and easier debugging in Node.js.
Tailwind... men som spørrespråk? 🤯
Tailwind CSS er min foretrukne måte å stilgi appene mine på. Det er bare noe veldig behagelig med å kunne samlokalisere styling og markup på et kompakt og verbost format. Dette er også en gedigen bonus når du skal kode med KI. Når struktur og stil er tett bundet sammen, tvinges agenten til alltid å ta hensyn til stylingen. Du slipper å følge opp i etterkant og minne agenten på å oppdatere CSS ved siden av markupen.
Jeg er nok ikke alene om dette, da Tailwind CSS kom ut seirende som det mest brukte CSS-rammeverket i årets State of CSS 2025, hvor hele 51% av deltakerne svarte at de brukte Tailwind CSS. Så dette er helt klart noe som er blitt svært populært. Så, hvorfor ser vi ikke flere verktøy som Tailwind CSS?
Det spurte kanskje Marko Marinovic seg, for i forrige uke publiserte han et Tailwind CSS lignende rammeverk kalt TailwindSQL! Det beskriver han som "SQL queries with Tailwind Syntax". Her er tanken at du gjennom et spesielt React-element, <DB>, kan skrive spørringen din direkte inn i className-propen, og få resultatet av spørringa inn i DOM-en.
Er vel bare å migrere over kodebasen sin til TailwindSQL da, eller? Jeg hadde nok unngått det. Dette er nok mest ment som en spøk og utforsking, og ikke noe som faktisk er ment å tas i bruk, for Marko selv skriver:
«Do whatever you want with it (except deploy to production 😅)»– Marko Marinovic
Gøy å se hva folk finner på!
TailwindSQL - SQL Queries with Tailwind Syntax
Like TailwindCSS, but for SQL queries. className your way to database queries in React Server Components!
Det var alt for denne gang, god jul og godt nytt år! 🎄
