What’s new in Svelte: June 2024
Better bind
s, migration tooling and a new comparison rune
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 Svelte
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 Showcase
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:
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 👋