What’s new in Svelte: October 2023

Svelte 5 isn’t out yet (you can, however, preview it now), but that doesn’t mean we don’t get a sneak peek! Most notably are Runes - a simpler way to manage reactive variables in Svelte code. There’s lots of links the showcase section for deeper dives on all things Runes, but let’s talk about what else been released this month...

What’s new in Svelte & Language Tools

• Svelte 4.2.1 was released with a bunch of fixes to HTML, CSS and sourcemap compilation
• The latest version of the Svelte language tools enhances component references in the “Find All References” command, fixes a persistent issue with automated types going missing after restarting a project and adds fallback handling to auto-types (like those found in SvelteKit’s +server.js files)

What’s new in SvelteKit

• +server.js now has a catch-all handler that handles all unimplemented valid server requests. Just export a fallback function! (1.25.0, Docs, #9755)

That’s all for the new features! If you’re looking for other patches and performance updates, check out the SvelteKit CHANGELOG. You can also find adapter-specific CHANGELOGs in each of the adapter directories.

---

Community Showcase

Svelte Summit Fall is happening on Nov 11, 2023. The 7th Virtual Svelte Conference is open for proposals until October 15 - anyone can submit!

Threlte is throwing a hackathon (motion warning for the landing page - it will respect Reduce Motion settings). The kickoff event is on Sunday, 15 October 2023 16:00 UTC.

Apps & Sites built with Svelte

• game-of-life-svelte is a Conway’s Game of Life implementation using SvelteKit tech
• Limey is an easy-to-use website builder for simple sites and landing pages
• Appwrite’s new landing page is now written with SvelteKit (previously covered was their console UI in Svelte)
• PlaceIt is a game about numbers and places
• Sveltroid is a fan-made recreation of Metroid Prime: Remastered (code)
• Bolighub is a Denmark housing search portal
• Dithering is a tool to dither photos with plenty of options
• Rocky Mountain Slam is an interactive map to follow Jason Heyn as he attempts to complete the first ever Rocky Mountain Slam (code)

Learning Resources

Featuring Svelte Contributors and Ambassadors

• Svelte 5: Introducing Runes... with Rich Harris and its follow-up: Svelte 5 runes: what’s the deal with getters and setters?
• Conditionally stream data in SvelteKit by Geoff Rich
• Svelte Runes Change How Reactivity Works In Svelte, Make A 3D GitHub Skyline With Svelte To Flex On Your Peers, Simple Page Transitions Using The View Transitions API With SvelteKit and Using JavaScript Libraries With Svelte Is Easy by Joy of Code
• Modern Web Podcast S11E2 - Exploring Svelte, Open Source, and Discord Bots with Willow (GHOST)
• We are back! Svelte 5, Transitions, What’s New?! by Svelte Radio
• This Week in Svelte:
  • 2023 September 1 - SvelteKit 1.24.0, View Transitions API, AbortController
  • 2023 September 8 - SvelteKit 1.24.1, Capacitor walkthrough, reusing prop types
  • 2023 September 15 - SvelteKit 1.25.0, deserialize form data, magic is coming
  • 2023 September 22 - Svelte 5 Runes!

To Watch

• RUNES - Coming in Svelte v5 | My Take by Coding Garden
• Don’t Sleep on Svelte 5 and Level Up Your Svelte Stores by Huntabyte
• Introduction To Svelte Runes (Every Svelte Rune Explained) by Cooper Codes
• Svelte Runes: Awesome or Awful? by Jack Herrington
• Let Build A Youtube Clone With SvelteKit (Svelte, Tailwind Css, RapidApi, Shadcn Svelte, Axios, etc) by Lawal Adebola

To Read

• Create the Perfect Sharable Rune in Svelte by Jonathan Gamble
• You Don’t Need to “Learn” Svelte by KaviiSuri
• Build Websites with Prismic and SvelteKit by Angelo Ashmore
• How to embed Svelte apps inside PHP? by Justin Ahinon
• Using Web Browser’s Indexed DB in SvelteKit by Shivam Meena
• Integrate Storybook in Svelte: Doing it the Svelte-way by Oscar Dominguez
• The Sveltekit tutorial: Part 1 | What, why, and how? by Suyashtnt

Libraries, Tools & Components

• KitForStartups is an Open Source SvelteKit SaaS boilerplate
• SuperNavigation is a mobile-like navigation UX for the web
• skeleton-material-theme is a Material theme for the Skeleton UI library
• better-i18n-for-svelte is a SEO focused library for multi-language SvelteKit sites
• uico is a Tailwind plugin that provides utility classes for basic UI elements
• svelte-maskify is a action wrapper for AlpineJS masks
• sveltekit-capacitor is a template for building a SvelteKit SPA with Capacitor
• router-gen.ts is a type-safe router for SvelteKit

That’s it for this month! Feel free to let us know if we missed anything on Reddit or Discord.

Until next time 👋