Svelte with Rich Harris

Hey, everyone, welcome to PodRocket. Today I'm here with Rich Harris, who's the creator of Svelte. How are you, Rich? I'm good, thanks. How are you? I am doing well. It's been raining the past few days but excited for hopefully a decent

weekend. And I'm excited to talk to you. I've been hearing a lot about Svelte over the past few years, but I honestly have not done a deep dive myself so I'm excited to learn about it from you. So maybe you could give us a quick introduction. What is Svelte? How does it help build great web apps? Oh, man. You think that I'd be really good at giving an answer to this question by now, but I've yet to fully dial it in. Essentially, if you're familiar with front end frameworks,

like React and Vue, then you'll be familiar with the basic idea of Svelte, which is that it makes building robust web applications easier, instead of imperatively manipulating the DOM with document.createElement and all of the things that are provided by the platform. It puts a declarative layer on top of that so that you can describe the output that you want, and then the framework's job is to translate that into the underlying DOM manipulations.

Where it differs from those frameworks is that it does as much of the work as possible at build time instead of at runtime. And what I mean by that is that rather than creating a structure like a virtual DOM which then has to be reconciled against what's already on the page, Svelte analyzes your code during your build step and converts it into, essentially, vanilla JavaScript or as close to possible as what you would write if you are writing

your code by hand. And so because of that, it's able to deliver a few important advantages. It generates typically very small code, which means that your application is going to load very quickly, and the updates, when you have a state change within your application, also take place very quickly, because it doesn't need to regenerate your entire application. It's just surgically updating the part of the page that's affected. I should say at this point, because this is what I've been telling people about Svelte

since it first came around in 2016, the landscape has actually shifted a little bit and other frameworks are, in many cases, becoming a little bit more Svelte like. So when I talk about these unique advantages, they're not so unique anymore. Svelte's selling point these days is really more about the developer experience it provides. Vue, in particular,

has adopted a lot of these techniques and also has some of those bundle size and performance characteristics. But that's the basic gist. That's why Svelte exists, and the promise that it provides developers. And is there an ideal use case for Svelte? Would you say use Svelte for any type of web app on building, or does it tend to work better in maybe simpler or more your application where performance is maybe or bundle size is of more concern? When should people think

about using Svelte? Well, I should talk about where Svelte came from, because that indicates what it was initially designed for and what we initially thought of as being the sweet spot. I work as a graphics editor at the New York Times. I've been working in interactive journalism for most of my career. And Svelte was really designed to solve the problem that we had, which is we want to build these very highly-interactive applications. Typically, we're doing things like data visualization