Svelte 5 Released

Svelte 5 has been very nice to work with over the past few months. Yes, runes require you to think more carefully about lifecycles and updates. And you may end up writing a little more code initially than with svelte 4. But it serves you better in the long run with complex apps. I found a process for gradually turning a simple app into a more complex one that works for me. I iteratively move $state() runes out of .svelte files and into .svelte.ts files where I build a more abstract data-oriented structure for my app from a series of mutually linked classes. Then those runes can be re-imported into the .svelte files, or used and updated wherever you need. If you plan it right, I think it avoids the need for heavy redux-like state management. (at least I think so. I haven't worked with redux much myself)

Do you know of any large OSS software built with Svelte? I'd like to see how it turns out in the long run, because I'm reticent of all frontend frameworks nowadays through what I perceive as gateways to uncontrollable accidental complexity and abstractions.

Ofcoz hypest and ml opensource software frontend are build with svelte and they're very successful

huggingface https://huggingface.co/pydio https://huggingface.co/docs/chat-ui Ollma webui https://github.com/open-webui

These are just a few of them that I quickly search and look at their popularity .

MVC is all the rage these days

Just my personal opinion: I love svelte for small projects but the whole runes rewrite just feels so much less ergonomic. A step in the direction away from the simplicity that drew me to svelte in the first place.

That said, there is backwards compatibility with the older syntax, so this isn’t a dealbreaker, and the team does a good job of explaining the reasons behind their selected design patterns.

(Interestingly, I’ve felt the opposite with react lately - they’ve been making the dx simpler).

Does https://github.com/dbgate/dbgate count?

Immich uses SvelteKit for its frontend: https://github.com/immich-app/immich

I’ve used it as a reference for a NestJS+SvelteKit app in the past, they did a pretty good job.

Huly was just recently on the HN frontpage: https://github.com/hcengineering/platform

Gradio: https://github.com/gradio-app/gradio

Windmill - https://github.com/windmill-labs/windmill

PocketBase's UI is built with Svelte: https://github.com/pocketbase/pocketbase/tree/master/ui

EDIT: Also, not OSS, but https://search.brave.com seems to be built with Svelte

Gradio is built with svelte https://github.com/gradio-app/gradio

Apple Music isn't OSS, but it's quite a large Svelte app: https://music.apple.com

more notable companies using svelte because this always comes up https://x.com/SvelteSociety/status/1260209026563858432

Only viewable if you have a Twitter account, which is less and less common these days.

This is more or less where I’ve landed lately. There are some things I really like in Svelte and Solid but not enough to overcome the massive ecosystem advantage React has.

I never understood the ecosystem argument as applied to Svelte. Vanilla js libraries integrate with it pretty much perfectly, meaning you don't need a Svelte port of a given library. The ecosystem is effectively huge.

> I iteratively move $state() runes out of .svelte files and into .svelte.ts files where I build a more abstract data-oriented structure for my app from a series of mutually linked classes. Then those runes can be re-imported into the .svelte files, or used and updated wherever you need.

I don’t know exactly how you do this, but it sounds like you are dangling on the global state of the runes. This is DANGEROUS in Svelte and can definitely ruin your day.

There aren't very many good modern, maintained vanilla js libraries. But for just about anything I need in React I can find something polished and well supported that just works.

Could you elaborate on why it's dangerous? Aren't runes just proxies with some variables in them?

Of course! I was very used to SPA, and the convenience of moving a rune/store to an external file meant it could be accessed anywhere (as the post said). With SSR however, if you’re not careful, you can easily leak data: https://github.com/sveltejs/kit/discussions/4339.

I have no idea Apple was using Svelte, that's cool

Another notable example is Yahoo Finance, which is written in Svelte

https://finance.yahoo.com/

Thanks. also this https://github.com/sveltejs/kit/discussions/4339#discussionc...

I'm not sure I understand. What types of libraries? When I think of libraries, I think of ExpressJS, lodash, JQuery, left-pad, etc. There are absolute tonnes of vanilla JS libraries.

I've rarely used React, are you talking about React-specific libraries? I find it hard to believe that there are more maintained React libraries than vanilla JS libraries.

I don't have a strong opinion on the whole, but as someone who's been building a diagramming app for 2+ years, I've found react-flow to be the most solid free & open-source node-based diagram component, by far. At least in terms of quantity/quality of features and UX/DX. Though admittedly I haven't thoroughly looked at alternatives in about a year.

It basically singlehandedly convinced me that the ecosystem was worth going with react when I started my project, despite really enjoying svelte.

All those libraries also work in React of course. The only vanilla js libraries that don't work well with React are UI libraries that assume they can control the DOM. But I can't think of many of those I'd prefer to the many excellent React UI libraries.

HuggingFace https://github.com/gradio-app/gradio ChatUI , lots of AI applications UI are build with / ontop of svelte. https://github.com/huggingface/chat-ui

Ollama's OpenWebUI https://github.com/open-webui/open-webui

Cannot edit my previous answer i mentioned wrong page. , updated proper links

Framer Motion, react-three-fiber, react dnd, just a few that come to mind.