Det er ikke bare Next.js som nettopp har kommet i ny versjon de siste dagene.
På lørdag under en virtuell Svelte Summit-konferanse ble den ferdige versjonen av Svelte 5 lansert, etter å ha vært tilgjengelig i en RC-versjon (Release Candidate) siden mai.
Lanseringen ble gjort av Svelte-skaperen Rich Harris og utviklerteamet som merget inn pull request #13701 live under Svelte Summit.
Announced at Svelte Summit today:
— Ben McCann (@BenjaminMcCann) October 19, 2024
- Svelte 5 released
- sv, the new Svelte CLI
- new https://t.co/Xj49aAyghW website to go live next week
- Svelte Hackathon with thousands in prizes
See https://t.co/Tq2rTyITGG and https://t.co/lejkJKnZqk for more details
I den nye versjonen har Svelte-teamet rettet en del bugs siden RC-versjonen kom ut, slik at Svelte 5 nå regnes for å være klart for å kunne brukes i produksjon.
Den største endringen: Runer
Den antagelig aller største nyheten i Svelte 5 er Runer, som ble introdusert allerede i september 2023 da nyheten om Svelte 5 først kom. Men det skulle altså ta over ett år før den endelige 5.0-versjonen så dagens lys.
Runer er kort fortalt en ny måte å håndtere reaktivitet på i Svelte-apper, basert på signals.
Runene begynner på $ og ser ut som funksjoner:
let message = $state('hello');
Det finnes flere ulike runer, som $state, $derived, $effect, og så videre. Hvis vi tar $state-runen som eksempel, så lar den deg lage en reaktiv tilstand, som betyr at brukergrensesnittet i appen din vil oppdatere seg når verdien endrer seg:
<script>
let count = $state(0);
</script>
<button onclick={() => count++}>
clicks: {count}
</button>
Men i motsetning til for eksempel React, så er det ikke noe API du må interagere med for å endre tilstand (som i React, der du ville skrevet noe slikt som const [state, setState] = useState(initialState), og så bruke setState for å endre variabelen state).
I Svelte 5 kan du bare si at en variabel skal være en $state-rune med en bestemt verdi, så kan du oppdatere variabelen som om den er en hvilken som helst annen variabel.
Nytt nettsted
Tidligere har det vært ganske forvirrende at Svelte og SvelteKit-rammeverket har hatt to ulike nettsteder, selv om SvelteKit er den måten Svelte-teamet anbefaler å bygge Svelte-applikasjoner på.
Derfor har Svelte nå lansert en ny nettside der du finner alt på ett sted – inkludert dokumentasjon for både Svelte og SvelteKit.
Du finner den nye nettsiden på https://svelte.dev/
Nytt CLI-verktøy
Svelte har flere ulike CLI-verktøy for å for eksempel opprette en Svelte-app, legge til funksjonalitet eller migrere kode fra én versjon til en annen.
I helgen lanserte Svelte ett felles CLI-verktøy for alle oppgaver – "sv". Med sv har Svelte-teamet slått sammen create-svelte og svelte-add, slik at du nå kan skrive for eksempel:
npx sv create
npx sv add
npx sv migrate
Eller hvis du vil migrere til Svelte 5:
npx sv migrate svelte-5
En av nyhetene i sv er at CLI-verktøyet kan brukes til å legge til vanlige avhengigheter for deg når du oppretter et nytt Svelte-prosjekt – og også etter at prosjektet er opprettet. Det kan være for eksempel Tailwind CSS, ESLint, Prettier, Drizzle, Vitest, Storybook og mye annet. Det skal også komme integrasjoner mot blant annet Supabase.
Next.js 15 er klar: React 19 og mye raskere dev-server
Rich Harris har lagt ut en bloggpost om Svelte 5-lanseringen, med mer om hva som er nytt her.
Du kan se hele helgens Svelte Summit under: