What's new in Svelte: July 2021
Keeping cool with fixes, TypeScript tooling and tonnes of new features
As the northern hemisphere heats up, Svelte has stayed cool with lots of performance and bug fixes, better TypeScript support, and lots of new components & tools from around the ecosystem. Let's take a peek 👀
New in SvelteKit
adapter-nodenow precompresses assets using gzip & brotli (#1693)
Support for TypeScript transpilation has been added to the
svelte-kit packagetooling (#1633)
Improved caching defaults in
Allow configuring Rollup output options (#1572)
Fixed usage of SSL with HMR (#1517)
Features & bug fixes from around svelte/*
Svelte 3.38.3 (released June 22) includes a bunch performance and bug fixes - including hydration optimizations,
thispreservation in bubbled events, and more!
The latest language tools releases added support for prop renaming from outside of a component, PostCSS syntax grammar, and a
.d.tsoutput target in
svelte2tsxwhich can be used to create type definitions from Svelte files.
Also in language tools, some long-awaited experimental features for enhanced TypeScript support were added - including explicitly typing all possible component events or slots, and using generics. Have a look at the RFC for more details and leave feedback in this issue if you are using it.
svelte-scrollergot some quality-of-life fixes in 2.0.7 - fixing an initial width bug and updating its
Coming soon to Svelte
Apps & Sites
SvelteThemes is a curated list of Svelte themes and templates built using svelte, sveltekit, elderjs, routify etc.
Beatbump is an alternative frontend for YouTube Music created using Svelte/SvelteKit.
Sveltuir is an app help you memorize the guitar fretboard
Svelte Radio: A Jolly Good Svelte Summer is a conversation about what's new in Svelte and a celebration of Svelte Radio's 1-year anniversary
Class properties in Svelte is a refresher on the power of
classfor developers switching over to Svelte from React
Sveltekit Tutorial for Beginners is a video playlist for learning SvelteKit by WebJeda
How To Cache Dynamic Pages On Demand With A Service Worker In SvelteKit walks through the power of service workers when used within SvelteKit for on-demand caching
Vue vs Svelte: Comparing Framework Internals dives deep into the differences between Vue and Svelte from the inside out
Setting up a development environment for SvelteKit with Docker and Docker Compose walks through how to use Docker to create reusable development environments, no matter what kind of device you run your code on
Render Katex with Svelte from zero to hero demonstrates how to implement Katex in a Svelte project
Using Custom Elements in Svelte shows some of the quirks to look out for when using custom elements in a Svelte site
Libraries, Tools & Components
Sveltotron is an Electron-based app made to inspect your Svelte app
svelte-qr-reader-writer is Svelte component that helps read and write data from QR codes
svelte-stack-router Aims to make Svelte apps feel more native by routing with Stacks
svelte-typed-context provides an interface which, when provided to
setContext, allows for stricter types
svelte-modals is a simple, flexible, zero-dependency modal manager for Svelte
Want to contribute a component? Interested in helping make Svelte's presence on the web better? Submit a Component to the Svelte Society site by making a PR to this file or check out the list of open issues if you'd like to contribute to the Svelte Society rewrite in SvelteKit.