18 ms·

Svelte 5 Released

• k__ 2y ago
  Finally. Runes are a pretty slick addition, as someone who comes from React, this feels like home.
• zuhsetaqi 2y ago
  From the changlog on Github: The new version brings: - even better performance, - a more granular reactivity system with runes, - more expressive template syntax with snippets and event attributes, - native TypeScript support, - and backwards compatibility with the previous syntax!
  • notpushkin 2y ago
    Here’s the release on GitHub: https://github.com/sveltejs/svelte/releases/tag/svelte%405.0.0 https://github.com/sveltejs/svelte/releases/tag/svelte%405.0... Probably a better link for this post?
    • tln 2y ago
      Or even https://svelte-omnisite.vercel.app/ https://svelte-omnisite.vercel.app/ which is linked from there. It is the v5 Svelte homepage, currently svelte.dev is v4 Edit: I'm not so sure that's up to date actually. Lots of "Coming soon" sections
      • notpushkin 2y ago
        Yeah, looks like work in progress (and when it's ready I think it will be on svelte.dev)
      • gr__or 2y ago
        This kind of feels like an accidental release, would not expect one of the big frameworks to drop a new major with so little doc around it?!
        • ar-jan 2y ago
          It's because they wanted to release it live during Svelte Summit https://www.sveltesummit.com/2024/fall https://www.sveltesummit.com/2024/fall
    • swyx 2y ago
      Rich said a blogpost will be coming on monday, presumably that will be the canonical link to actually post on hn
• adamnemecek 2y ago
  I learned Svelte 3 over a year ago and I found it very pleasant. Unlike React, Svelte is an integrated framework, no "pick your router" nonsense, I don't want to be picking a router. I like the direction Svelte going in, the old syntax was ok but not great. I wonder how this new Svelte compares with some of the other new kids on the block like solid.js and alpine.js.
  • ansc 2y ago
    nit: >React, Svelte is an integrated framework You're talking about SvelteKit. Svelte does not have a router.
    • adamnemecek 2y ago
      Good point.
      • ChocolateGod 2y ago
        https://adonisjs.com/ https://adonisjs.com/ can be an alternative for SvelteKit if you want a more all guns blazing framework to use with Svelte.
• taikahessu 2y ago
  Full v5.x changelog: https://github.com/sveltejs/svelte/blob/main/packages/svelte/CHANGELOG.md https://github.com/sveltejs/svelte/blob/main/packages/svelte...
• dvrp 2y ago
  We use Svelte 4.0 in production and it performs beautifully; it rarely is the cause of our frustrations. Excited to try the new version. Lately I’ve also been wondering about the relationship and correlation between software writing skills and writing skills.
  • chistev 2y ago
    What makes you think about a possible correlation?
  • twic 2y ago
    Besides a mathematical inclination, an exceptionally good mastery of one's native tongue is the most vital asset of a competent programmer. -- Edsger W.Dijkstra https://www.cs.utexas.edu/~EWD/transcriptions/EWD04xx/EWD498.html https://www.cs.utexas.edu/~EWD/transcriptions/EWD04xx/EWD498...
    • miki123211 2y ago
      If your native tongue isn't English, I don't think that's necessarily true any more.
      • aegypti 2y ago
        Expression, comprehension, and mastery of the form are still independent of English, it was never about direct utility or anything.
  • qudat 2y ago
    I had the same thought recently: https://bower.sh/on-writing https://bower.sh/on-writing
  • joakims 2y ago
    Same! Writing code and writing literature are curiously similar. It begins with thinking, both structured and creatively. Breaking a story down into pieces while keeping the bigger picture, and making a plan for how to approach it. Then comes the difficult metamorphosis where abstract ideas/concepts are turned into concrete words/code. Good literature/code is concise, expressive, even beautiful. It doesn't come about easily, but takes time. The author reshapes and refactors the text until it meets some standard that the author aspires to, often revisiting it days later to read it with fresh eyes. Then it's committed for review, and may still have to be reworked a bit. I agree with those who say that coding is more art than engineering. At least if you're really good at it.
• dvrp 2y ago
  Blog post will be published on Monday: https://x.com/Rich_Harris/status/1847682508822913359 https://x.com/Rich_Harris/status/1847682508822913359
• deleted 2y ago
  [deleted]
• simonsarris 2y ago
  I love Svelte and use it for all my personal projects and all company projects (except strictly static sites are still built with just 11ty but I hate it and want to move off it). But I'm going to wait a bit on v5 for the company, scanning all the issue headlines, it looks like there are a still a lot of unresolved edge cases: https://github.com/sveltejs/svelte/issues https://github.com/sveltejs/svelte/issues As for my latest personal project, upgrading right now so I can help find more of those edge cases :D
  • taikahessu 2y ago
    Definitely try Astro for static sites, I'm loving it!
    • akudha 2y ago
      Do you think Astro would be good for a site with tons of data (graphs, tables etc)? Can it be used with db, user logins?
      • chrisldgk 2y ago
        Yes, yes and yes. It kind of depends what your project uses under the hood and what it depends on, but Astro is quite flexible with the frameworks it supports and for many things there’s a first-class integration that lets you just install support for certain libraries and frameworks (for example Tailwind, React, Partytown, certain CMSes) with one command. For DB and user logins, you might have to run in SSR mode to be able to do server-side stuff, but you can certainly build API routes, server middleware and interact with cookies for user token stuff.
    • yawnxyz 2y ago
      I've started using Astro for static sites, but also as a lightweight Sveltekit replacement. I saw they have Svelte 5 support, and maybe this would make runes a killer app if we can inject the runes into Astro, (or even React) components?!
  • codelikeawolf 2y ago
• jauntywundrkind 2y ago
  From listening to webdev podcast #1, Syntax.fm, the gist I get is that a lot of what used to be invisible compiler magic is now more visible & explicit. The compiler user to rewrite property access to make reactivity happen. Now you can kind of see yourself updating & reading/reacting as you sprinkle runes in. Implicit to explicit magic, with Runes as the headline demonstration of that. Other examples very welcome!
• bippihippi1 2y ago
  can I do async derived stores by default yet? It was kinda tricky to get working in svelte 4 and even Square/svelte-store wasn't super ergonomic. Would be super nice if it was built in
  • ysofunny 2y ago
    seems to be kinda the whole point? (I may be way off the mark) just came back to svelte after using version 3 previously, and I'm still finding my footing;
• clessg 2y ago
  Exciting, I love Svelte! Does anybody have experience with both Vue and Svelte? It's been a while since I used Vue but it seems like both frameworks have converged quite a bit over the years. With this release I'm particularly curious now: why would somebody pick one over the other?
  • BodyCulture 2y ago
    There is no way around trying yourself. Stop wasting time asking people for their opinions about frameworks and start building your own insights from first hand experience.
    • clessg 2y ago
      Oh, okay. Thanks.
    • lenkite 2y ago
      Its a valid question, esp if you haven't used a framework for years and want to get to know what other people think of the newer versions. Nobody has time to keep up with all the JS frameworks unless they are a youtuber who does framework comparison as their full time job. And even those youtubers fall behind in the JS world.
  • DarkUranium 2y ago
    I've recently moved from Svelte (initially 4, then 5) to Vue 3, and much prefer it. The big issue for me was the lack of support for nested observables in Svelte, which caused no end of trouble; plus a lack of portals (though maybe the new snippets fix that?).
• gfs 2y ago
  Where would one even start learning more about front-end development in today's world? Ignoring the dizzying amount of frameworks, how could I become knowledgeable enough to connect my back-end experience to design the "full stack?"
  • mlboss 2y ago
    I just ignore the whole “frontend stack”. I would suggest to stick with traditional server side rendering and for interactivity use htmx/alpinejs.
  • maxbond 2y ago
    Pick a stack and dive into it. If you find yourself getting analysis paralysis, just pick one arbitrarily; you're not getting married, you're just getting started. Make things and get feedback on them. At the end of that process you'll have the background to reevaluate your decisions.
  • Vinnl 2y ago
    I think truly full stack is probably too much to ask: just accessibility is a huge area of knowledge, for example. I can fiddle around with back-ends, but I want someone more experienced to check my work or just directly help out with e.g. scaling or observability. That said, if you truly want to learn, MDN is the reference, and they have a pretty good curriculum too: https://developer.mozilla.org/en-US/curriculum/ https://developer.mozilla.org/en-US/curriculum/ Also, ignore the dizzying amount of frameworks. Learn web technologies, and then React. There are millions of back-end tools as well, but in practice, you only use a limited set. Front-end is the same.
  • notpushkin 2y ago
    Play around with some stuff and see what works for you best. Personally, I didn’t get frontend at all before React came by, and then switched to Svelte because it fits my mental model exactly. If you don’t like anything – no worries! Classic SSR with templates and stuff is a thing too, as another commenter pointed out. Edit: no matter what, make sure you write good HTML first and foremost. Use proper semantic tags, don’t add dozens of nested divs, use native controls when possible etc. Make sure to check accessibility, but it should be OK if you don’t do any weird stuff. MDN is a great starting point.
• notpushkin 2y ago
  Good work! I’m not really sold on the runes stuff though (tldr: https://svelte.dev/blog/runes https://svelte.dev/blog/runes) The old way is a bit “magical” in a sense that it does some stuff under the hood to implement the intention behind your code, but it reads really straightforward: let counter = 0; // ... <div>{counter}</div> `let` in a .svelte compoment makes a variable reactive. If your state is outside a component, you use stores. With the `$store` rune, the way you make reactive stores inside and outside components is the same, but it only works in .svelte.js/ts. The unification is great – but why not just use `let` in .svelte.js, too? // counter.svelte.js export function createCounter() { let count = 0; return { get count() { return count }, increment: () => count += 1 }; } // App.svelte <script> import { createCounter } from './counter.svelte.js'; const counter = createCounter(); </script> <button on:click={counter.increment}> clicks: {counter.count} </button> I understand it can be really tricky – e.g. you might want to use let for things that are not modified in runtime and do not need reactivity, but it should be possible to determine in compile time. (Actually after writing this all up I think I know why Svelte went with runes instead, haha!) But again – really good work and I hope to try it out on my next project!
  • papichulo2023 2y ago
    My only problem with this is because now is more verbose, why I should use Svelte over Vue? Arguably a more stablish framework. No shadow dom and a better template directives? Maybe, not sure.
    • notpushkin 2y ago
      I don’t have a definite answer as I haven’t worked with Vue that much. Still, I like Svelte syntax a bit better (e.g. {#each x in xs} vs. v-for), and yeah, all the compile time reactivity stuff works out pretty well in terms of performance. The runes are still optional, I think, and you can still use the old syntax. Not sure if that will be true in Svelte 6 though!
      • benmccann 2y ago
• Squarex 2y ago
  What's the preffered way to make simple SPAs using Svelte now? I'm using this +layout.ts with sveltekit: > export const ssr = false; export const prerender = false; But it feels awkward for real SPAs - internal applications that have no need for server side rendering.
  • ffsm8 2y ago
    What's the goal of disabling SSR though? I get that hydrations value is mainly in SEO and a tiny improvement in initial draw speed, but why would you want it disabled, specifically? It's pretty much what you already wrote though. https://kit.svelte.dev/docs/single-page-apps https://kit.svelte.dev/docs/single-page-apps
    • catlifeonmars 2y ago
      wouldn’t not running a server be a reason to disable SSR?
    • toastercat 2y ago
      Sometimes you don't want to develop a full-stack application.
      • ffsm8 2y ago
        Ah, if that's the goal then you should be fine with the static adapter instead. Is linked in the previous link - and here You'll only need the fallback page and can omit the +layout prerender configuration. It's documented on that page https://kit.svelte.dev/docs/adapter-static https://kit.svelte.dev/docs/adapter-static
    • MatekCopatek 2y ago
      The most obvious reason for me would be running something other than Node on the backend, i.e. only using Svelte for the frontend.
    • sibeliuss 2y ago
      SSR always yields surprises! If you don't _need_ it, don't enable it; everything is simpler.
• sansseriff 2y ago
  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)
  • mhitza 2y ago
    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.
    • v3ss0n 2y ago
      Ofcoz hypest and ml opensource software frontend are build with svelte and they're very successful huggingface https://huggingface.co/pydio https://huggingface.co/pydio https://huggingface.co/docs/chat-ui https://huggingface.co/docs/chat-ui Ollma webui https://github.com/open-webui https://github.com/open-webui These are just a few of them that I quickly search and look at their popularity .
    • bbkane 2y ago
      Does https://github.com/dbgate/dbgate https://github.com/dbgate/dbgate count?
    • tjhorner 2y ago
      Immich uses SvelteKit for its frontend: https://github.com/immich-app/immich 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.
• codelikeawolf 2y ago
  This really made my day. I decided to convert a pretty large project over to v5 a couple of months ago because the new APIs were so much nicer. I rolled the dice a bit because I wasn't sure if I was going to hit weird edge cases, but everything went smoothly. Congrats to the Svelte team and major kudos for coming up with runes!
• gumbul 2y ago
  Do they still operate with very little backwards compatibility policy? They killed the sapper project and replaced it with sveltekit. Is sveltekit still alive?
  • cmews 2y ago
    They still support svelte 4 syntax and announced today as well a new migrate CLI to help moving from svelte 4 to svelte 5. CLI tool: https://github.com/sveltejs/cli https://github.com/sveltejs/cli Edit: added the link to the CLI tool
  • hu3 2y ago
    Sapper was a looong time ago in terms of web dev chronology. I even forgot. Why makes you think SvelteKit could be dead? What a weird a pessimistic phrasing.
    • gumbul 2y ago
      It's not a pessimistic statement. I'm just saying they did. There is no guarantee that they will not do the same in the sveltekit project :) I recommend people make smart decisions and use it.
  • jdsleppy 2y ago
    SvelteKit is very alive and is the way svelte apps are made generally, not like next.js which is more optional.
• levmiseri 2y ago
  I can wholeheartedly recommend Svelte. As someone who can only do vanilla HTML/CSS/JS, it lets me build projects quickly and efficiently without having to learn something complex like React. Case in point this silly side project made in Svelte over a weekend: https://meoweler.com https://meoweler.com
  • willy_k 2y ago
    That website is actually a great way to compare options, thanks for sharing! I did find that it gives a 500 error for Birmingham, AL specifically, if you’re still working on it.
    • levmiseri 2y ago
      Thanks! I plan to do a better pass over all cities with a new update to the site.
  • dangsux 2y ago
    [dead]
  • joshdavham 2y ago
    > As someone who can only do vanilla HTML/CSS/JS This is also why I chose SvelteKit as my first framework. I was actually pretty fluent in vanilla since my first real web project was a full stack chrome extension, but when it came time to choose a framework for my first true web app, I chose Svelte because it was the only framework I could immediately understand.
  • rukshn 2y ago
    This is a really nice website. Few things, for me the domain name is difficult to remember The page doesn’t fully scroll down for me and the discord button is not accessible on mobile Other than that the site it nice
  • NetOpWibby 2y ago
    > vanilla HTML/CSS/JS Svelte reminded me of how I got my start with coding. I love it. Refusing to learn React has cost me job opportunities but Svelte is just so much more pleasant to use and easy to grok. I’m currently building a social network with SvelteKit and I couldn’t be happier. Excellent DX.
• yawnxyz 2y ago
  Is there are Svelte 5 Runes tutorial for those who are familiar with previous Svelte and Sveltekit?
  • lasarkolja 2y ago
    [dead]
  • Slylencer 2y ago
    Svelte is getting a new website soon too. It's in preview mode here: https://svelte-omnisite.vercel.app/ https://svelte-omnisite.vercel.app/. Tutorial is not completely converted yet. (edit) Sorry, for previous users the preview site might be better: https://svelte-5-preview.vercel.app/docs/introduction https://svelte-5-preview.vercel.app/docs/introduction
    • joshdavham 2y ago
      > Tutorial is not completely converted yet. Any idea of when the new tutorial will be complete? I might go back and refresh some stuff.
  • rootext 2y ago
    https://component-party.dev/compare/svelte4-vs-svelte5 https://component-party.dev/compare/svelte4-vs-svelte5 best format to compare to my mind
• b3ing 2y ago
  Hope it starts to chip into React’s usershare and more companies adopt it, but I know that’s a slow process especially for the big companies. I got out of front end development for most of the years Angular and React have dominated and it looked like a mess, but Svelte and even Astro make sense, maybe I’m just old school. I would totally go back to the frontend with these new frameworks.
  • sureIy 2y ago
    If Vue hasn't made a dent, I don't ever expect Svelte to. Angular was the only high-level competitor and I haven't heard that one in a long time already. For a framework to eat into React's usage, it needs a strong evangelist (like Facebook has been for React)
    • b3ing 2y ago
      But didn’t Vue come before React? And it’s mostly the same from what I understand, it’s not totally different like Svelte. I think it can change, if more people put it on their resumes and LinkedIn and if those that know React say can do things in 1/3 the time with Svelte and mention that in interviews as well. That is a slow way of evangelism for Svelte that can spread.
      • WickyNilliams 2y ago
        No, react came first. And Vue is not the same. Vue 3 added reactivity via refs (which are essentially signals by today's terminology). They can be used outside of components, like Svelte's runes. Svelte 5 is very similar to Vue 3. So much so I jokingly called it "svuelte" when they first announced it. Vue gets unfairly overlooked imo. I worked with it for 12 months and it was mostly a joy
        • CharlieDigital 2y ago
          Looking at the docs, Svelte is a mix of React and Vue, IMO. They reverted from the `on` syntax while adding in signals like Vue's `ref`. The way the props pass down is more akin to React than Vue, but the overall reactivity system feels the same as Vue. I'm not sure I'd pick it over either Vue or React.
• ledgerdev 2y ago
  What's the latest on building PWA's with Svelte/Kit 5?
• stormfather 2y ago
  An interesting datapoint: I made my first website a few months ago (I'm an ML engineer). I tried in both Svelte and React. I used Sonnet as a copilot the whole time and expected Svelte to be more difficult because there are orders of magnitude less training data on it. To the contrary! The LLM tied itself in knots very quickly with React but mostly did ok with Svelte/Sveltekit. Also, the Svelte stuff it makes is usually snappier. However it does have a wider range of UI widgets it can grasp with React. It seems that my opinion that React is horrendously and hideously overcomplicated is at least somewhat objective! Svelte has been quite pleasant. To any devs out there that have to work with React, you have my sympathies. Compared to Svelte it's just flaming hot putrid garbage.
  • nwienert 2y ago
    Strong words, I actually enjoy it quite a lot. For trivial stuff I can see how Svelte can seem simpler. But effects, JSX, and the React model tend to be incredible at composition at scale. And the close to the metal to JS nature is something I strongly prefer. Now granted I’d never use a reducer, and imo a decent state library is the biggest win if you are using React.
  • colonelspace 2y ago
    Another interesting datapoint: Every time I try out something other than React (Vue, Svelte, etc), I have to learn some new syntax, understand the runtime magic, and add a syntax/LSP to my editor. But React is just JS/TS, which is straightforward. Being disappointed by a library/framework because your LLM of choice can't produce decent code doesn't really tell me very much about the library, other than it's usage is varied.
    • recursive 2y ago
      The difficulty with react generally isn't the syntax. It's the constraints of hooks and reconciliation. Since mutation is always disallowed (but not by mechanical constraints) data changes are harder to express. You have to remember to keep your effect dependency list synchronized even though the linter can tell you when it's wrong. State continuity depends on the heuristics of the reconciler considering this component instance (and all its parents) to be some particular component instance from a previous render function output. The syntax is maybe the only good part of react. And I still think the way it uses JSX is not great. Conditionals and .map seem... weird. But yes, judged from syntax only, react is ok.
• tamimio 2y ago
  Is there any svelte components or better a full boilerplate/template to save the time building front-ends?
• codeflo 2y ago
  Someone on Twitter claimed that Svelte 5's runes are basically a nicer (custom) syntax for Solid.js -- is that true? I find the way Solid.js decouples signals from components to be a huge step up from React's state management in terms of abstraction capability and composability.
  • Blackarea 2y ago
    Hm i haven't checked the svelte 5 runes yet but last time I checked i also felt that solids reactivity concept is just beyond what svelte offers. If i wasn't that much in love with solidjs i'd probably pick svelte though. But i already see it coming that i won't be able to let it go until i checked the new runes now...
  • asqueella 2y ago
    Kinda: https://svelte.dev/blog/runes https://svelte.dev/blog/runes > Svelte 5's reactivity is powered by signals, which are essentially what Knockout was doing in 2010. More recently, signals have been popularised by Solid and adopted by a multitude of other frameworks. > We're doing things a bit differently though. In Svelte 5, signals are an under-the-hood implementation detail rather than something you interact with directly.
• ChocolateGod 2y ago
  Been using Svelte for about 8 months and have fallen in love with it, using it in production for both personal and company projects. My only gripe is it doesn't support <template> tags or class list arrays out the box, meaning I've had to use preprocessors instead, the latter for me makes it far nicer to mentally visualise components when using dynamic tailwind classes.
• neontomo 2y ago
  any sense in porting a v4 project to 5?
• beginnings 2y ago
  all the big frameworks bar react are switching to the solid model of signals and fine-grained reactivity people would be better off just using the real thing, Solid
• amelius 2y ago
  Doesn't the philosophy behind Svelte justify a broader scope than just Web apps? Shouldn't this be a more general programming language, not tied to the web?
  • joakims 2y ago
    It is a popular choice for apps made with cross-platform frameworks like Tauri and Electron. It even powers a big POS device in Brasil.
• impulser_ 2y ago
  Why should someone use Svelte 5 over Vue 3? Performance might be the only reason IMO, but once Vue Vapor is release that will most likely not be an advantage. The Vue3 and Svelte 5 API are almost the exact same, but Vue can be used in TS/JS and Svelte 5 can't. I do think SvelteKit is better than Nuxt by a lot. Maybe that's a big advantage.
  • CharlieDigital 2y ago
    One of the speakers at the recent ViteConf (maybe Antfu) said something interesting: most of the modern libs now are interchangeable. It comes down to preferred syntax and ecosystem.
    • meiraleal 2y ago
      No they are not. They would if they were natively webcomponents based but none are
  • written-beyond 2y ago
    Well I don't know how Vue3 is but I used Vue before, don't know exactly which version it was. I found the mental model behind managing state in Vue a little difficult. There was a lot of syntax I had to learn/understand before I could work with it. OTH when I first worked with a svelte working with the code base was extremely straightforward, and that was my very first time touching JS. I think the main reason for Svelte5 to exist was that state can now be shared beyond the boundaries of a .svelte file. They needed a reactive stateful primitive which is the $state addition. I recently tried to start building something in NextJS, I worked with react a little bit and thought it really isn't going to be that hard. I honestly didn't get far, I really needed to understand a bunch of concepts before I could just start working. This isn't something I experienced when I started working with Dart&Flutter. I appreciate all of the work other authors have put in to make UI in plain JS and not bend the language to their whims, but I don't think UIs can be built ergonomically without that. Historically UIs have always been best expressed in languages built around that fact. HTML, CSS and Vanilla JS pushed the envelope for UI development but with what's expected from UIs in this age of browser based computing, that model just doesn't age as well given the complexity it adds. It's why I reckon people won't give up on making UI frameworks in Rust, because it's macro system allows the authors to build supports around a language that really could not get far on just it's own.
• purple-leafy 2y ago
  Svelte. Interesting framework, I dipped into React then tried Svelte and loved it initially - very noob friendly. I really liked having HTML/CSS/Js all in one place. But then tailwind became popular, and I realised I could get this same UX with React + Tailwind. Now I prefer React + Tailwind to Svelte. No Svelte jobs, weird compiler magic. Hated SvelteKit
  • novoreorx 2y ago
    Can't believe you get downvoted so hard just because you dislike Svelte, is praising Svelte the new PC in Hacker News?
    • purple-leafy 2y ago
      People are sheep haha, everyone hates react because it’s trendy
• nzoschke 2y ago
  Congrats. I discovered Svelte through the 5 RC and immediately fell in love. I’m in the process of porting an HTML audio and Spotify Web Playback music player to Svelte5 and it feels so clean and productive. https://github.com/nzoschke/jukelab https://github.com/nzoschke/jukelab
• manishsharan 2y ago
  Svelte vs React is discussion that will never end. For those of us who do not like to code complex logic and state in javascript, I can recommed htmx https://htmx.org/ https://htmx.org/. Also, I am more comfortable writing backend code and this just fits my style better.
• kolanos 2y ago
  Any recommendations for component libraries for Svelte?
  • scosman 2y ago
    DaisyUI and shadcn-svelte are the big two.
    • benmccann 2y ago
      shadcn-svelte is great!! https://www.skeleton.dev/ https://www.skeleton.dev/ and https://flowbite-svelte.com/ https://flowbite-svelte.com/ are another couple of popular ones. There's a big list at https://www.sveltesociety.dev/packages?category=design-system https://www.sveltesociety.dev/packages?category=design-syste...
• h_tbob 2y ago
  I don't understand how React is so popular, still. With Svelte and Vue, I don't think anybody should do a new project with React.
  • Waterluvian 2y ago
    I can’t speak for the majority, but for my team it’s because it’s not worth the distraction. We’ve got years of experience and tooling and “tradition” with one approach. Why do we want a second? It’s also just not an interesting issue. In my experience, the actual coding (and later maintenance) of a web application is the least challenging, least interesting part of the project. At that stage, all the interesting problems have generally been solved in workflow, process, data structure design and general de-risking. Classes? Hooks? Binding style? Tabs or spaces? I really couldn’t care less. Just be consistent so you can all build and develop skills together. I admit that when I was younger this kind of thing seemed to matter to me. I dunno if it’s because I’m now more focused on big picture or if I’m just tired and don’t care anymore. Maybe both!
    • Aeolun 2y ago
      This sounds familiar. We know React, and while I’d dearly love more automatic performance, it’s not worth introducing a whole bunch of new complexity to do that.
    • troad 2y ago
      I really like this anecdote, and I very much think you're speaking for a lot of people here. Tech is tooling. Some people make a hobby out of the tooling, others merely use the tools to build something. It's totally valid to make a hobby out of tools (e.g. motorcycles), but it's easy to end up with all sorts of highfalutin' opinions about how the tools must or must not be used, that hinge on minute distinctions that fundamentally don't matter to someone looking to merely use them as tools.
    • VMtest 2y ago
      From users' point of view, they only care about the performance really Some e-commerce apps use React in WebView on Android and the apps will become unresponsive after visiting several product pages (more than 10 probably). They have to be force closed and opened to be used again
• KaoruAoiShiho 2y ago
  Considering trying out Vue or Svelte after working with React (hate react). Do they have a batteries included bootstrap with social auth?
  • joshdavham 2y ago
    > Do they have a batteries included bootstrap with social auth? Nope, but it does have routing!
    • kevinak 2y ago
      Actually, with the new Svelte CLI you get auth “built in” https://github.com/sveltejs/cli https://github.com/sveltejs/cli
      • mkl 2y ago
        What do you mean? This doesn't seem to say what it does, and the documentation link is broken. I can't find anything related by searching either.
  • bufferoverflow 2y ago
    I had to switch to Vue from React after switching jobs, and I gotta say, Vue is so much better in almost every aspect. I won't choose React for my own projects again.
• stevev 2y ago
  I love Vue. Svelte is great! Unfortunately nothing beats react especially if one plans to develop for mobile. Despite how ugly the nuances in react are compared to those two, it’s still more mature making the other two trying to catch up and feel outdated in terms of features.
• joshdavham 2y ago
  Since we're all here: what UI libraries are y'all using in your SvelteKit apps?
  • atilimcetin 2y ago
    My favourite is daisyUI
  • memset 2y ago
    https://www.shadcn-svelte.com/ https://www.shadcn-svelte.com/
• frio 2y ago
  This is fantastic news. Between the Svelte 5 RC and Deno 2, I’ve been really enjoying working with the JS/TS ecosystem for the first time in a long time — it’s just been vaguely difficult keeping up with the (minor) tweaks in the RCs along the way. Congratulations to the team :).
• crowdyriver 2y ago
  nice and everything, but it still has plenty of performance issues and crashes with the tsserver. Using solid start because of that, tooling is not there yet.
• russellpekala 2y ago
  If you like Svelte, Yuzu Health is hiring developers to work in Svelte in New York City. https://yuzu.health/careers/senior-software-engineer https://yuzu.health/careers/senior-software-engineer Seems like the number of companies using Svelte in production is growing but still not super high.
  • nophunphil 2y ago
    Russ - can you please explain the rationale for "In person NYC 5 days a week" and that it's non-negotiable? It seems that you're restricting your talent pool in a labor market that prefers remote work. Given that the Svelte talent pool is smaller as-is, this is counter-intuitive.
    • schnebbau 2y ago
      Presumably because whoever's in charge decided that's how they want to run their business.
      • tucnak 2y ago
        How dare they? Oh, no, why wouldn't they think of the labour market?!
• pier25 2y ago
  I've been using Svelte since v3 was released almost daily. I've been using v5 for the past couple of weeks and it's fantastic. The biggest improvement IMO is that you can now write reactive logic intuitively outside your components and it just works without needing to use complex machinery or patterns like Mobx, Redux, or Vuex. I've been doing frontend since the 90s and used everything under the sun. Svelte 5 is the most pragmatic and elegant solution I've ever used.
  • ssijak 2y ago
    How is mobx complex, its literally plain class for reactive data and wrapping components with observer()
    • pier25 2y ago
      Have you ever looked at all the code that it needs to do that? Plus an integration lib like mobx-react. And even then the performance doesn't compare to Svelte 5, Solid, etc.
  • sampullman 2y ago
    You can use reactivity outside components in Vue without Vuex, I don't find it to be much less intuitive than Svelte (which is also nice, don't get me wrong).
    • pier25 2y ago
      You can but it's nowhere near as elegant and natural. Vue exposes ref(), .value, etc which personally I find to be just cognitive overhead. With Svelte 5 you just use $state and don't need to care about the implementation details. Furthermore, thanks to the compiler approach, your Svelte code is not coupled with an internal API anymore.
• solatic 2y ago
  Svelte noob here: can someone more experienced explain why runes are getting people excited? My untrained eye starting reading the Svelte runes documentation and it just made me go "well I guess Svelte is getting React Hooks?"
• sureglymop 2y ago
  When I recently looked at SvelteKit, what confused me the most was the universal load function. If you use "if !browser" with sveltes browser object, the things inside that branch will only run on the server. But because svelte is compiled, these functions get compiled to two different versions, one for the server and one for the client, in which that if statement has been completely compiled out. That in itself isn't bad but it's weird that normal code and control flow influences compilation. In other languages this would be a macro or something that clearly expresses that it's metaprogramming. Then there are some other weird things like props being merged and potentially overwriting each other in a deep level. But that is by design and can be reasoned about. What also felt weird to me is that there is no recommended way to do initialization logic such as reading in a config, reading from the environment and preparing something for the rest of the lifetime of the application. Has anyone had similar experiences/confusions when learning SvelteKit?
  • delanyoyoko 2y ago
    Why will I use !browser, when I simply move that code into .server endpoint (or file)?
    • sureglymop 2y ago
      Because then you are doing a different thing than I did there. The universal load function specifically not only injects the data on the server before serving the page but then also runs on the client once the page is loaded. In my specific case the client side version hit a different api, hosted in a different region. There are different use cases for this though.
  • Cloudef 2y ago
    > but it's weird that normal code and control flow influences compilation. In other languages this would be a macro or something that clearly expresses that it's metaprogramming. Similar kind of thing happens in zig during comptime execution.
    • sureglymop 2y ago
• WuxiFingerHold 2y ago
  Svelte 5 is almost heaven, I thought. But it's full heaven. To keep it short: The Svelte team did a remarkable job improving every aspect but preseriving the characteristics and distinctive features (fast, small, easy, elegant). Now, where I struggled (using Svelte 5 on a business logic heavy SPA since RC in April): Signal in general are extremly easy to use, but quite hard to track. You have to "know" or "find out" if something is reactive. Vue makes it easy with their .value API, but also not 100% foolproof. With React: Everything is a value. Unidirectional data flows. It's very easy to follow the flow of the data. With Angular: Data pipelines are built using RxJS. Hard to learn, but extremely powerful. You can follow the data flow quite well. Not as easy as with React, but once you are good with RxJS, still easy enough. With Svelte 5: Runes look like values. This mental model is good enough most of the time. It's especially great in small contexts where you exactly know where your variable comes from or where everything is reactive. But Runes also behave like signals and proxies. So, you sometimes need to know exactly what is in your bag. Is it a value? A signal ($state with value or $state.raw with object or array)? A proxy ($state with array or object)? In larger contexts it gets really hard to track. Why is Svelte still full heaven to me: I realized that Runes are just the basic building blocks. They are the common basic toolkit. I don't have to use them in large business logic areas of my apps. I can create (nominal typed, using TS of course) custom wrapper classes, e.g. to only allow signals, not proxies. This wrapper classes could disallow mutation. Passing those around makes it type safe. If I see a value, it is a value. If I see a type of my reactive wrapper class, it is reactive. Or, I can use RxJS and Svelte 5. Or I can mimic Vue's or Solid's APIs (as Rich showcased). There's a spot in the new docs (wip) where the Svelte team is going to explain Runes. I think they're also (as other Signal experts - I hope Prof. Signal Carniato solves this for all of us :-)) working on better debugging tools. I'm happy. Big thanks and respect to the Svelte team.
  • 9dev 2y ago
    It’s interesting to watch this carcinization of reactivity in all major frameworks. They all started out differently, but seem to settle around the same general concepts. These days, you could sit a React guy in front of a modern Vue app, and they could probably figure out how to work with it relatively fast.
• sureIy 2y ago
  Unpopular opinion: Svelte 4 was much better. It was truly invisible and it used basic JS syntax to do what you wanted. Now runes ruined it.
  • joakims 2y ago
    Good news: it's optional.
• fold_left 2y ago
  I'm curious what users of Svelte think about https://qwik.dev https://qwik.dev, have many of you been tempted by it? There are a lot of similarities and both are great at keeping file sizes down with a great DX.
  • aembleton 2y ago
    I'm not a front end developer; so what I think about this might not be relevant to someone who works on front end every day. To me qwik looks like many other JS frameworks as far as the developer experience goes - it mixes up the HTML output into JS functions. I really like the way that Svelte has a single file that encapsulates the HTML, CSS and JS for a page and it does so as three seperate chunks of the svelte file. This means I just need to look at say blogPost.svelte to see everything I need and I don't need to think about namespaceing or BEM or anything else for the CSS. Its this way of working with Svelte that I really like and rarely see from other frameworks. I find astro to be good for this too.
    • fold_left 2y ago
      I agree, that's a really nice feature of Svelte. It can be done in .astro files from https://astro.build/ https://astro.build/ too but Svelte is the first place I saw it done, like you say, it's very nice to work that way.
• mklkkk 2y ago
  [flagged]
• izackp 2y ago
  My first web project was with svelte. Lack of a debugger for the server sided JavaScript seems just as silly to me as server sided JavaScript. I would consider that alone a non-starter. I’d recommend another solution for experienced devs.
• mklkkk 2y ago
  [flagged]
• jhonmike 2y ago
  [flagged]
• iamkneel 2y ago
  The blog post is up: https://svelte.dev/blog/svelte-5-is-alive https://svelte.dev/blog/svelte-5-is-alive