What's new in Svelte: June 2024

Better `bind`s, migration tooling and a new comparison rune

Dani Sandoval Jun 1 2024

The maintainers have been hard at work getting the Svelte 5 Release Candidate ready for release. In this month's newsletter, you'll find highlights from the pre-release CHANGELOG and a host of items from our community showcase.

Let's dive in!

What's new in Sveltepermalink

• bind: is now disallowed on component exports in runes mode and has much better types to tell if a prop is $bindable (5.0.0-next.113, 114 and 125, Docs, #11238, #11225 and #11498)
• Tons of work on the migrate tool to make migrating to Svelte 5 syntax easier (5.0.0-next.116, 136 and 137, Docs, #11334, #11659, #11704)
• MathML is now supported (5.0.0-next.120, Docs, #11387)
• The Svelte Inspector is now supported (5.0.0-next.125, Docs, #11514)
• The $state.is rune lets you compare values or check if an object exists within a deeply reactive object/array (5.0.0-next.134, Docs, #11613)
• The rootDir compiler option makes filenames relative to simplify development in monorepos or complex folder structures (5.0.0-next.135, #11627)

Community Showcasepermalink

Apps & Sites built with Svelte

• Onlook is a chrome extension that enables designers to contribute to their team's UI codebase
• Fluid Type Generator is a modern fluid type generator built with Svelte 5
• LCH Palette Generator is a tool that allows you to easily create and save gradient palettes to be used in UI design
• Typepost is a simple text post generator for social media
• Equimake is a collaborative real-time 3D platform for learners, gamers, artists, and coders
• svelte.dev-machine is a physical based animation to replicate the Svelte machine on the svelte.dev homepage

Learning Resources

Featuring Svelte Contributors and Ambassadors

• Svelte 5: Compiler, Signals, and Web App Performance by JSJ 627 with Rich Harris
• Svelte London - May 2024
• This Week in Svelte - deep dives into the Svelte changelog and new learnings from the week:
  • 3 May
  • 10 May
  • 17 May
  • 24 May

To Read

• Securing Your SvelteKit App and Prevent Waterfalls from Multiple SvelteKit Server Hooks in sequence by Captain Codeman
• Svelte 5 Todo App with Firebase by Jonathan Gamble

To Watch

• Svelte 5 Runes Demystified by Peter Makes Websites Ltd
• How to Build an eCommerce Store with SvelteKit by Crystallize

Libraries, Tools & Components

• Floating UI Svelte is a library for positioning floating elements and handling interaction
• Svelte Animated Pixels provides an easy way to create pixelated canvas animations by just declaring maps of pixels a strings
• SvelteKit Passkey Template is a SvelteKit template project featuring Passkey authentication, Google sign in and mailbox verification
• svelte-infinite is an infinite scrolling library designed for Svelte 5 with runes
• svelte-next attempts to automated Svelte library updates

That's it for this month! Let us know if we missed anything on Reddit or Discord.

Until next month 👋