The Swyx Mixtape

Video: https://www.youtube.com/watch?v=JfZm0tPUxjE
Site: https://codingcat.dev/podcast/1-15-whats-up-with-svelte


Details

Shawn or perhaps more popularly known as, Swyx, is a frequent writer and speaker best known for the Learn in Public movement and recently published The Coding Career Handbook with more advice for engineers going from Junior to Senior. He has worked for Netlify and AWS and is also the co-host of the Svelte Radio podcast.

Questions

Additional Links Mentioned

These are fun picks of the week. Maybe something you bought online, a great show you are currently watching, or that last book that you thought was amazing.

Shawn Wang

Brittney Postma

Alex Patterson

Alex Patterson: [00:00:00] Welcome back. Perfect peeps to perfect ad dev today on the show we have Shawn Wang also known as Swyx. Hey Shawn, how's it going? 

swyx: [00:00:11] Hey, thanks for having me. Yeah, happy to be here.

Alex Patterson: [00:00:15] Thanks. Thanks for coming on. A little bit about Shawn, or perhaps popular known as Swyx is a frequent writer and speaker best known for the learning public movement. And recently published the coding career handbook with more advice for engineers going from junior to senior, he has worked for Netlify AWS and is also the co-host of felt radio podcasts. That was quite a bit of stuff.

swyx: [00:00:39] Yeah. Is that too long of a bio? I've been thinking about cutting it down?

Alex Patterson: [00:00:42] I don't think so. I think it's perfect. 

Honestly, I really like busy. 

Brittney Postma: [00:00:47] That's really cool. We like 

swyx: [00:00:48] all the content. Okay. Making up for lost time. I was a career changer, so from 2011 to 2017, I was finance. And now I'm trying to make up for it.

Alex Patterson: [00:00:59] I think you're doing a great job. You've probably leaped over a lot of us. So I probably varied deleted as I always tend to do, because I'm just so excited about the guests. Usually not as much, well equally as the sidle and subjects. So, today we're talking about what's up with felt. And possibly some things there.

Brittany will probably lead a lot of this conversation today. Folks, you probably hear too much from me, but Brittany loves fell. And so, I'm going to let her take charge on this one quite a bit. The only things that I want to know before we dive in is felt where are you these days? Are you at home or where are you? 

swyx: [00:01:32] Not for those watching on video. This is clearly not daylight.  It is 3:00 AM my time in Singapore. And basically this is where I was born and raised and where my family lives. Normally I live in New York but. You know exactly a year ago, I fled New York because I wasn't sure if the healthcare system could take me if I got COVID.

So I came back to the only place I knew, which is here. And I've been here. It was supposed to be like, I actually packed for like two months and I left all my stuff in my apartment and I was like, it's a short trip. It's fine. And now I'm still here. Repeatedly. It's 

Brittney Postma: [00:02:06] crazy. That's exactly how we all felt like it's going to be over in a couple months.

Like, let's just do this for now and then no, we're still here a year later that you got to go back to the family. 

swyx: [00:02:19] I've lived through this I've lived through SARS which actually shut down schools here in Asia for a while. And I think Americans don't know how it is. So maybe, I do think that you ha you don't take it as seriously if you haven't been exposed to it.

But like everyone everyone of us in Asia knew exactly what to do. And we just did, follow the playbook. But it was over in two, three months. It wasn't like, We were scared. I was scared for my baby sister. I was like, what well did you just get born into? But it was fine. And and I thought this would be the same way and it wasn't.

So there we go. Well, I'm 

Alex Patterson: [00:02:49] even more happy to have you on the show now that I know exactly what time zone you're in, it's crazy early or late defending. So thanks again. I don't know what hours you're keeping these days, so, 

swyx: [00:03:00] really appreciate it. I call it the reverse nine to five. So we wake up or start work at 9:00 PM and at 5:00 AM.

And it turns out that it's not too bad, like as long as like the house is quiet, which it is, then you have to focus on your work and you'll eat dinner with your family. And that's fine. Yeah, 

Alex Patterson: [00:03:17] that's crazy. Well, awesome. Well, yeah, not to drive too far away from it. I'm glad you're you were able to get home and healthy and we're super excited to talk about smelled.

So I hope you're. I hope you're ready to talk about it too. Yeah. I 

Brittney Postma: [00:03:30] am extremely excited to be talking about like, I, this is my favorite framework, library, whatever you want to call it. Right. Like compiler, but what do you. Thanks spelt is. And how is it different from those other front end frameworks that are out there?

swyx: [00:03:48] Well, I'd be interested in your take since you're also, the resident expert. 

Brittney Postma: [00:03:53] I don't know if I would consider myself an expert, but yeah. I mean, I know spelt is a compiler, so I think of it as a framework because it's structures or code, right? So it's something that structures your code and that you can write some form of markup in it's like an HTML super set.

So that's kind of how I view it as a framework that compiles away. Yeah, 

swyx: [00:04:16] my, my experience, I came from, I started with view and then I moved to react. And then I found svelte. And so I view that I view this progression in frameworks as just ways different ways in which to write user interfaces on the web.

And to me it's felt is the simplest by far that I ever tried, it is a full sort of batteries included. It is a joy to to write. And the docs are really easy to explore. And the community is very nice and welcoming and small, which it seems like a surprising thing to want a small community, but having been in the large community like reacts, I was a moderator of the.

Reacts, separated where there was over 200,000 people. Large communities have their problems too. And sometimes small is beautiful. And I think that's a lot of the philosophy has felt, like the basic hello world should not. Come with like, 120 kilobytes of uncompressed JavaScript.

And unfortunately that's what you get with some of the heavier frameworks. And you that just doesn't matter for things. So Svelte  like its name. It's a compiler framework compiler first. So unlike viewer reacts where you can just drop things in with a script tag, it's felt you do have to run a build step.

But. With that one compromise you get a lot of mileage out of that build step including things like first-class animations, first-class styling support which react doesn't have. So I enjoy that. And of course the output bundle is as small as possible. Sometimes an order of magnitude smaller than what you get with react or view.

And that's just because it's adopts a fundamentally different approach. I don't necessarily think one is better than the other. I just observe my mood, like, okay. So I think there's a S I still advise. Beginning developers to go learn reacts because that's where the biggest job market is.

Okay. But once you're pretty secure and like your front end knowledge and your like your choice of tech stack, doesn't dictate your economic value. Then you should explore two tools that just make you happy and more productive. And for me, that's felt. 

Brittney Postma: [00:06:15] Yeah. You mentioned a couple of things that are actually some of my favorite things about spelt the developer experience.

I feel like it is so fun to write. Like it is just simple and I almost feel like I know job market isn't quite there yet, but it's probably one of the easiest for developers to jump into right out of the gate. Once, you know, HTML, CSS and Java script, you can write spelt. It gets just that simple. So that's one of the things that I really love about it.

And if the job market catches up, like, do you think that might be one of the things that we get to where they can learn that first? 

swyx: [00:06:51] Yeah, absolutely. So, we, we say things like the job market isn't there is it's not zero and it's growing every day. Apple is actively hiring for salt developers.

And so as Ikea I think something like American airlines is also using there's a bunch of, so I helped to run this fall society community, which is kind of like the official community as felt. And we just keep a list of who's using salt and production and it's very long list. Yeah.

And 

Brittney Postma: [00:07:16] there's felt jobs, right? It's 

swyx: [00:07:18] full jobs. Yep. Yep. Schneider electric, there's, household names and then there's less household names, but still very important, big companies that use felt. And I, I just. W at what point, how many, w is there a number at which we're happy or does it have to be a number one in order for people to be happy?

Like we can get jobs using salts like that. That's not in doubt. 

Brittney Postma: [00:07:37] I think that it's easy for people to jump in. Would you agree with that? Like where people could just jump in and learn it right after learning HTML, CSS and JavaScript. 

swyx: [00:07:47] Yeah, no, absolutely. Yeah. In fact, like, I think the progression from HTML is probably the simplest compared to the other two frameworks, because it is a HTML super set, like you just said, 

Brittney Postma: [00:07:57] Yeah.

And those sugar syntax that we get with smell, I feel like are so much, I don't want to say better, but with react. And JSX like, there's so many of those nuances that you have to do, like class name and you have to do whatever your attribute is equal to. And then you have to put the JavaScript in there and we can just do those shorthand.

Syntax is in spelled that are so nice. 

swyx: [00:08:21] Yeah. There's good and bad in the sense that it does add learning curve to the framework and reacts intentionally for better or worse is on the other side of that. Spectrum, but for things that we do multiple times a day, every day, it's nice to have a shorthand.

Brittney Postma: [00:08:38] That's really nice. And you mentioned one of those other things that are my favorites is the built-in animations with spell are just outstanding and it's so nice. Especially if you're building a static site, like you can do page transitions easily. You can bring in like a little. Fade in animation, whatever you want.

And it's just, it comes out of the box and you get that easily. Also actions are another thing that's felt provides you. And can you explain more about what actions are and how you used them and spell 

swyx: [00:09:06] it? Yeah, I haven't tried explaining this. So this will be a challenge. Actions are basically life cycles or side effects of components that mounts on the Dom.

So you can instructs felt too. Run some code when something mounts, when something changes data and when something on mounts and that can be anything from measuring where the screen, where the most position is, there's a trick to triggering like a keyboard shortcut registration.

There's lots of use cases for actions. In fact we are, we actually starting to collect some of these. I have a felt actions, repo am I GitHub where I am proposing a couple of, I think, six of them so far. For example, you can change a button, like one of the problems with web apps and buttons in general is that if you bind something to click that works fine on a desktop, but then it doesn't translate very well to a mobile.

And for example, if you want to have something long press like that, that works on the long press you have to, it there's no event for that in, in I'm mobile. So you have to code it up yourself. So as felt action, how helps to give you reusable pieces of code that you can just say, all right, once this thing is mounted, let's add this additional listener with this preset amount of logic.

And that's an action that you can just say, like on long press do this other thing or on, keyboard, shortcut, trigger this other function. And these are just very convenient ways to attach. Individual pieces of logic and sometimes reusable logic to the Dom elements that you work with.

Are they all events they can generate events or they can sort of trigger based on events. So, so yeah that's how I think about it. And it's basically, you can map it to the react concepts of use ref and use effects together. You just don't have to write as much because use revenues effects are a little bit lower level.

And they give you more power, but they also give you more rope to hang yourself with. And actions are pretty straight forward. You just attach it to them and use them as there is. You're supposed to use them. Yeah. 

Brittney Postma: [00:11:03] And you said a little bit in there, how we have the on colon.

And use colon that we can use those with inside of the HTML super set. So there's like that little shorthand that you can use your action with. 

Alex Patterson: [00:11:16] I'd almost like to do I love what you guys are talking about, but I'd love to tie a visual to some of it. So I jumped out to the field site and some of what you're talking about, I'm like, I wonder what this looks like.

And they actually have some, like, felt examples out here for. 

swyx: [00:11:33] Hits at a draggable action. There's one there. I love it because I needed it and I just went to dogs and grabbed it and I was done. I didn't have, I did the same thing. 

Brittney Postma: [00:11:42] I just did it and had to go to the same one. 

swyx: [00:11:46] Do you see it? I 

Alex Patterson: [00:11:47] don't say it.

I don't know how I'm missing it though. 

swyx: [00:11:51] Actually it's actually, you just missed it. 

Alex Patterson: [00:11:53] I see animations. There we 

swyx: [00:11:55] go. Actions. Yeah, use directive. Okay. Is this the one with the drag? Yeah. Yeah, this is the one. Okay. That's so wild. Yeah. So, so these actions, the use the, the panel vote dot JS, that's the action.

And go look up, look at the code, right? It's, it's basically some like low-level mouse, smooth code, right? Which you write once, but essentially once you've written this function, you can go back to your main app. And then look at where Panama is used. So scroll down to use panel down there, right?

So you just attach it on and that generates three events that you hook into. So, on pen, start on pen move and on pen end. So these are ways to extend the platform, right? These are not natural, dumb, specific events that are generated by your browser. These are things where you synthetically create out of out of applying their use panel action.

And so now you have just event handlers, which you can use to do whatever. And here we were just. Implementing drag and drop just like that. 

Alex Patterson: [00:12:51] Has it on  felt like expert, I've written a couple of like little things to tie and firestorm, but when you actually write this and then you go through that build step, like you're talking about, and then beginning, this actually becomes just straight JavaScript, HTML on the other side, right?

swyx: [00:13:05] Yeah. Yeah. Just dominance functions. There's no intermediate library, which makes it very spelt. So I like the name. 

Brittney Postma: [00:13:11] Exactly. It fits right in.  

Alex Patterson: [00:13:13] Yeah. So for anyone that hasn't checked out, it's, Felia here's the main site. It kind of walks you through just different areas for write less code and you can dive into why that's the case.

And it just has these great little snippets of how to start taking in data. So curious, like using name with data Yeah it's pretty simple. And you almost think you're writing which you are basically writing JavaScript most of the time. So it's pretty, pretty awesome. 

swyx: [00:13:40] And 

Brittney Postma: [00:13:40] I, Ms. Swyx said earlier, like the docs are really nice.

They're really helpful. 

swyx: [00:13:45] Yeah there's something about single page docs and having an embedded ripple where people can experiment and play. It's a very nice community norm to the point where the first conference, the first fall conference that we organized I was like, Hey, we need a timer.

So I just like made a really crappy timer in this fall rapport. And then people just took that rebel and they cloned it. And then just add started adding like wacky animations and SBGs and all that. And it was just like a really fun and remixed cultural type of thing that. Could not have happened in the other frameworks, just because the other frameworks take so much setup and you have to fight over libraries and stuff like that.

Spelt is, designed by rich Harris at the New York times. And it's really, you can really tell that it's just like, I, it's one, it's a tool set for someone to be productive without having to make too many choices. And it's very much loved by the data journalists type of people who make interactive graphics and like drop in.

Sites and components even though it's capable of making full apps I'm just saying like, that's what hooks people from the start, which is how easy it is to get started. 

Brittney Postma: [00:14:43] Yeah, that touches a little bit on the article that you wrote. Right. Felt for sites, react for apps.

swyx: [00:14:47] That's a controversial one. Cause I got haters from both sides. 

Brittney Postma: [00:14:51] Oh, I liked it. I think you can write apps was felt, but I mean, it just wasn't there at the time of writing the article, right? 

swyx: [00:14:59] No, it was, I'm just saying like, you care about different things at different scales and I think.

In JavaScript. And in programming in general, we try too hard to make one tool fit all skills. And we should be more respectful of the fact that tools that are made to extends from the smallest thing all the way to the biggest thing we'd like to make claims like that. But you typically are not using the best tool for the job when you do that.

And so it kind of shows and, and that's why, I wanted to make the case essentially for react people, to try svelte. And first of all, people to not be so obsessive about salt, owning everything because your nerves are not there yet. And there's no point pretending 

Brittney Postma: [00:15:34] That is very true.

And I feel like we need to use the right tool for the job like that. That's what you're saying there. And 

swyx: [00:15:40] I do have a blog post. So it's a nuance thing. It's still new ones. I do have a blog post called in defense of hammers, which is this idea that if you have a hammer, then everything was like a nail, right?

It's like, it's a criticism of this person who has one tool and is like, use that tool to solve everything. And you know what? That's actually pretty great. Like if, if you have, you can just learn one tool and solve everything. That's awesome. That's good for you, like, cause what's the alternative, like learning a thousand tools.

That's also a lot of overhead. Right. So I think people are a little bit too lazy when they say use the right tool for the job. I mean, I just used it. So, I'm not exempt from this. It's a nuance thing. So maybe use two tools to do two different jobs. And just identify, that when you're working at small scale and working in large scale, these jobs are different.

They're not, they may not nominally be the same thing. Cause you're kind of working on the same substrate, which is the web, but at different scales, then different things start to matter. And so, so my example for why continue to use react was for example, react native, which is the most advanced sort of cross that forum JavaScript framework port, or whatever you call it, like SaaS native insomnia script exists.

Brittney Postma: [00:16:47] Yeah. What is felt native? Like I've heard of it, but I've never worked in it. Have you ever worked in spelt 

swyx: [00:16:52] native? No, I have not. So, but we did just interview a guy in SWAT radio. And be coming up, it'll be coming out in a couple of weeks, but yeah, it uses native script, which is a way to generate mobile apps, from JavaScript.

It, I don't know what the trade-offs are between native script's approach and react native's approach. And I mean, I will I'll figure that out when I get there. I just haven't needed it yet because I'm, cause I'm only web. 

Brittney Postma: [00:17:14] Same. Yeah, exactly. And yet you touched a little bit on how nice the docs are, but when it comes to video tutorials, there's not really a lot out there right now.

Where would you tell people to go that wanted to get started with spelt? And would you ever consider creating a course was felt possibly. 

swyx: [00:17:30] Ah there are plenty of people who've made courses actually. There are some courses on AK dyo. I think Tomas Lacombe from Poland has made some videos there.

Rich Harris, the creator has taught himself has done a full workshop on front end masters. Both of these are paid sites but they're. Pretty worth it. In my opinion, there are free tutorials on YouTube. So probably the free code camp channel has a couple of hours or more of a good spell tutorial.

And I also know some people are making salt tutorials on their own. So Scott Selinsky from level of tutorials in syntax that FM has a full course together with like a it's a full stack it's felt core. So it has like authentication and stuff involved in Yeah. Yeah. It's on his YouTube and it's very high quality cause he's a professional video course creator.

And there's also a channel called spelt mastery, which which also goes into some of that. And Lee tan, who's also Singaporean. But also one of those core maintainers goes into the core code, has felt and explains how it works on his YouTube channel. So there are a bunch of different. And these are just the ones I know of right there, there are plenty of other things.

Like we accumulated a lot of them on this false society, YouTube channel basically any anyone who's a society member. It's free. Just some it can, you can send in, send it in and we just want to make this more accessible to people who want to learn. But there's also as felt Russia as well, India, SWAT, Brazil, there, they all got stuff going on.

Brittney Postma: [00:18:47] It's so the community is just like expanding like 

swyx: [00:18:50] crazy Japan. Hey cool. Cause like, I started as felt society essentially on a whim because I was like, so the story of what was happening is I'm friends with rich Harris just cause we were both in New York and we hang out a bit and and the first felt meetup was going to happen in London.

And I was like, I heard about that and I was like, Hey, we have to create her in New York. But the first meetup is in London, we got to beat them. Right. So, and so, so within one week I just announced that, Hey, where we're holding a meetup, I don't have a location. I don't have a place. I don't have attendee lists.

I don't have speakers. But we're just going to make this happen because we gotta be first. So it didn't a week. I got a place at a Microsoft building. Someone volunteered 50 developers and three speakers for the first fall society meetup. No, that's Rootstrap Holy smoke. Yeah. It was fun.

I mean, Twitter is great. And, I've been involved in the New York tech scene for three years, so it wasn't exactly like, from scratch, but it's a lot of friends and it's really a nice community. So simultaneously we had on the same day, October, first of 2019 we had foster Sadie's Stockholm.

So also the, of London is false society. New York. And we continued like that for a few months until COVID hit. So then we all went online and we just decided to merge. And now the three of us are the hosts of the swell radio podcasts, and we have organized two conferences together and we're going to do a third next month.

Yeah. 

Brittney Postma: [00:20:09] It's spelled comp next month. Is that what you just 

swyx: [00:20:11] said? Yes, faults summit, because we like. 

Brittney Postma: [00:20:15] All the other conferences 

swyx: [00:20:17] out there, but like, it starts with an S right. So you got to go with it.

I really want to start. So view had a view of Vixens for a while, which is kind of like the female organization. So Jen Lopers on that, right? Jen Looper. Yeah. Well, they've really renamed themselves to front end foxes, so they kept the alliteration. But I want to, I was thinking about like salt sisters is that's what someone suggested.

I don't know. But it's still looking for a. Champion of that weak link, Brittany, 

Brittney Postma: [00:20:49] I'm taking on so much. I don't know about taking on more than right now, but yeah, that sounds great. Yeah. All right. I know we diverged a little bit. Let's get back on topic. 

Alex Patterson: [00:21:01] I really appreciate it. I'm trying to keep up with all the mentions and all the HTML links are so getting 

Brittney Postma: [00:21:08] all those notes in the show notes.

We actually had Scott to Linsky on last week. And you mentioned his felt course, and he has an animating spelt course too, that I really loved. I actually perfect picked it last week and it's a really good course too. But I saw you have a course on egghead IO on design systems with react and TypeScript in storybook.

Do you think spelt would be a good choice for building a design system since it's so close to that base? HTML that we talked about? 

 swyx: [00:21:34] Oh, this is an interesting question. I think it would be good, but it would not be the only choice. And I would not be upset if people chose something else, because I mean, ultimately.

 Ultimately what choice of technology you choose for your company. And it really depends on your team and what they know well, and if you just randomly force a new framework on them without consultation, like that's not going to go over very well. So I prioritize the health of the team over anything on technology.

So as much as I like to fault it's just I'll do a go with whatever the team that wants to do. So, you gotta be a team player. But I will say that, so it's felt is a better base for a design system than react is mainly because a react design system is going to require you to use react in your main app.

Whereas felt it can actually build this web components which you can use in any app. 

Brittney Postma: [00:22:18] Yeah. And that's what I was wondering is if it's more dynamic in a way, because you can get that base HTML and Java script, and then you can. Move it into whatever you need it to be. 

swyx: [00:22:28] Yeah. I don't know if I'll call that dynamic, but it's more portable.

Yeah. 

Brittney Postma: [00:22:33] Affordable. That's a good word. 

swyx: [00:22:35] Yeah. I will also say like, any design system needs styling in react does not have styling. So.

Like you just have to solve a lot more problems with starting from a base of react. And some people love that. And then some people don't need to spend their time doing that. 

Brittney Postma: [00:22:48] Do you like storybook for using design systems 

swyx: [00:22:52] in react? I think it's. Okay. I think it's I it's born in. Okay. That's good. I'm friends with Dom in the, the team over there.

My problem with them is it's slow. So we use storybook in production, not production, but like professionally to develop. Netlify like the, the netlify.com. App and site, we have an entire design system sort of spelled out in storybook that things takes up something like 30 seconds to load. Because it's so slow.

I don't know what it is inside of storybook. It could be Webpack, it could be the initialization inside the storybooks internals. It's just slow. And it's getting slower. The more we add to it. So it's gotta be. Faster. I've given them a lot of crap in public about it. So they're aware and they're working on it.

And to be fair, to be really clear. I don't know. I'm not saying that I could do a better job. I'm just saying, I think we don't, I don't think this is the final state of things. I think that can be better. And and so, yeah, I secretly wants to build a better story book myself, but I think there's.

Laurie you bet 

Alex Patterson: [00:23:56] on pod rocket. Caleb Mozhan the creator of Alpine JS talking about how he was showing off some things to the storybook folks. And it was so much faster. They're kind of blown away. So I'd be interested to see all these little permeation. Yeah. 

Brittney Postma: [00:24:14] Shawn was on pod rocket 

swyx: [00:24:16] today. I am I, well, I recorded it a couple of months ago, but yes, it's released today.

Swyx yeah. 68. Yeah, exactly. No they're really cool. And I mean, I just, I. Obviously I've benefited from the blog posts. And I liked that they're branching onto podcasts. And I was very excited that to learn that they were launching a podcast. In fact I heard about it from an unrelated, like non-developer podcasts because those, the founder was on there.

He just like casually mentioned it and they searched it up. They hadn't even announced it yet. And I was the first to ever tweet about it. So I kind of got the scoop and then they was just like, okay, well you want to come on 

Brittney Postma: [00:24:52] and log rockets a little bit into everything and everywhere. It's crazy. How like, guilty about it.

Yeah. Related. Yeah. 

swyx: [00:24:59] Yeah. I mean, th that's a little bit of content marketing and sometimes it's annoying sometimes, but I think they're generally on the good side. So give them a pass on that one. I think they talked 

Alex Patterson: [00:25:08] about that. Trying not to be annoying part when coder was on.

swyx: [00:25:11] Yeah. And you have to, like, if you're not annoying someone, you probably not doing it enough, so that's one perspective because yeah. The alternative is that you never blog and no surprise nobody's ever heard of you. Right. So, I F I feel both sides and I think sometimes it's a tough line to draw and everyone Johns at different ways.

So that's my take on that. So 

Alex Patterson: [00:25:30] This might be a question maybe for Brittany, because I think we brought it up with you. Swyx but maybe both of, and I just have no clue. I'm so confused. Between what's happening with Sapper and felt it. Can you guys explain to me, like what essentially is happening in that world?

swyx: [00:25:48] Ready you to take a crack, 

Brittney Postma: [00:25:52] get into that, like where's the future of spelt going? Like, what is it and is separate, dead. Like, we've heard all these like little key frames or keywords going on. So, I would like your take, like what do you think is happening and is separate going away or what is going on 

swyx: [00:26:08] there?

Yeah. I don't have any sort of inside information, but essentially what happened was last. Conference last fall summit recharge is actually made it, made the announcement that SAPRA would never be reaching 1.0 meaning it will never be considered production ready. He considered the existing foundations, to like he wanted to do a rewrite from scratch using the new tools that.

He enjoys, which is he has build and the different foundation for routing and stuff like that. So he eventually announced full kit, which is essentially sappers spiritual successor. There are a lot of companies, including rich rich, his own internal tooling that used Sapper.

So there's a natural question of like, what am I, are you just leaving me high and dry? And the answer is no, because everyone who's making salt kit. Has production separate apps and and they're going to ensure a good migration path. So it's full kit is fundamentally rearchitected from like, kind of a next yes.

Inspired next. Yes. Like as of like next year's version eight or nine it was like, He was originally architected as like a node server app. Right. You run a server, you run in it in node JS and it would serve requests. Now it's fun to me, fundamentally rearchitected to be a serverless solution.

So you would able to be, to split up serving your pages from different serverless functions. And some of them could be static. Some of them could be dynamic. And it's very much in the line of the new. This generation of meta frameworks like remix in the react world. And I think that's a fundamentally good architectural design to make.

And also it needs to be faster in, in sort of data generation. Like I, when I had my blog on Sapper, I ran into this so much so that I had to build a separate overlay to make the page generation a lot faster. And so, so there was a, there's a lot that goes into this technical decision-making but it is very exciting because it means that.

The server side rendering story in salt is no longer a separate project. Now when you MPM installs felt you actually get a CLI that generates an, an app for you that also does server-side rendering and can be deployed on a number of different platforms. They're going to have multiple adapters to CloudFlare, to AWS, to Netlify, to whatever.

And that's a much simpler story for me. It's gonna annoy some people that people get annoyed by change, but that's what's going on. So Sephora is not fully dead. It's not fully alive. It's just going to have a successor. At the time we thought it would be out by like the end of 2020. It is now March, 2021.

And but we think there'll be a public beta pretty soon. So, that's all I know, I, it'll come out when it comes up, but I think that it's felt philosophy has always been towards. Unified tooling that is simple and fast. Everyone in the community, has, it's a benefit of being a second framework.

Everyone knows what they want when they, when it comes to salt and it's its speed, its simplicity. And and I think SAP focus is going to deliver on that. 

Brittney Postma: [00:29:03] Yeah, as in the community are just waiting. Cause retires, keep saying Alpha's coming soon and we're like, Oh, is it ready? And I've tried it a couple of times.

It does still seem a little bit buggy. And I just saw that they moved from snowpack to Veit. You know what V is or how that's different from snowpack and what the difference of that is. 

swyx: [00:29:20] Yeah. And these are like, for anyone who's listening these are all new names that popped up in the last year, right?

Like if you're out of the loop, it's okay. Like, you're it's a full-time job keeping on top of all of these things. But I can explain it so. The whole goal, the whole innovation, I guess, that's taken place. And this is a broader thesis I called the third age of JavaScript going on is that we are replacing sort of legacy assumptions and, and just going all in, on sort of integrated bundling and IES modules.

So. Veit and snowpack are both solutions where they serve a dev experience. That's entirely based on IES modules which are, native JavaScript, important exports. This is different from what you may be used to in web pack roll. Roll-up where the import and export will be transferred to some kind of internal module representation, where they would stitch things together for you to bundle it up.

Which means that when you fire up a dev development mode to, run your apps on your, on your laptop it would have to build the entire app in order to serve your first page. Whereas with Veet or S or snowpack they would only just have to serve exactly the components that you requested in the current path.

And that scales, because it becomes linear time. Like, the number of pages, the number of components that you have It goes from linear time to constant time, which is just the number of components that you are requesting. So you can have a massive site and your lo your startup time would be exactly the same as something that's that's much smaller.

And also because you're basing it on a different base. So both feet in snowpack use IES build, which is a Webpack replacement from. Ironically a side project of the CTO of Figma Evan Wallace, cause he doesn't have enough to do. He made a new bundle that this thing is built and go rather than in JavaScript and it optimizes the hot paths.

So, it actually builds a hundred times and this is not an exaggeration. Exaggeration a hundred times faster than Webpack. And whenever you have order of magnitude changes in your development skills like that, you just unlock new levels of play and, and experimentation that you could not have before in your development.

So, that's why we basically have to burn everything down because there's just a new foundation coming around in JavaScript. And. 

Brittney Postma: [00:31:26] Yeah. And like those architectural changes that you were talking about, I feel like next JS just really like exploded in the last year. We're actually rebuilding our coding cat.dev site in next JS now.

And with Sapper kind of going away and spelt kit taking over that, those adapters that you were talking about, they have like a static adapter and I think it's a node adapter. Is that right? Do you know, if we're going to be able to do that, like next JS thing where it's on a per page basis or is it going to be like where the whole app is?

One way, 

swyx: [00:31:56] I think there's, I think probably just gonna be a third kind of adapter where you serve it from serverless. I don't actually, I haven't actually seen it and I'm not on the team that maintains it, so I can't promise it, but that was the original vision that I was told. So, That's as much as I can tell, because he's very bought into the serverless environment.

So I don't see any and any future in which he doesn't provide a service adapter. 

Brittney Postma: [00:32:17] Yeah. I mean, the only thing that I have in it is just I've played with it a couple of times. And like I said, I mean, it was kind of buggy. Like I couldn't refresh in the browser and things and I wanted it to do things that it just wasn't doing it and it wasn't there, but I'm really excited for the future of spell and how it's growing.

So, 

yeah. 

swyx: [00:32:36] In a sense, like, I wish that it's felt had a bit more backing to it, because the reason next year has, has had such success is because there's a company behind it and it's very incentivized to market it and to invest in its development and all that good stuff. Right? Like that's actually open source working at its best.

Here it's just like a loose connection of volunteers who like chip in on the weekends. So. That's why we don't have like firm's schedules and like even our conferences, when we put them together, it kind of buggy something, we had downtime and there's, it's just a, it's a mess. It's a community effort.

It's charming getting 

Brittney Postma: [00:33:09] that passion though. Like companies like put just the marketing and just the money into it, and we're getting the passion of the developers because that's what they want and that's what they need to see. So that's one of the nice things about 

that. 

swyx: [00:33:22] Yeah, a little bit challenged.

Cause like, as it grows clearly the community deserves better than like, it's like, like a fly by night volunteer sort of sometimes you're there. Sometimes you're not effort. Like Vue has figured it out. They, they have the, they do have the funding and they have a good organization and it's felt, I don't think it's there yet.

There there's, there's starting to be some kind of some measure of governance. In fact, my, probably my number one wish first of all, is just more open and regular committed governance to the project. And and you don't think about these things when you choose technologies when you're just starting out as a dev, but then the more you rely on these things and you see that you're downstream of the human principles and organizations behind the code, then you're like, Oh, okay.

I start to really care.

Alex Patterson: [00:34:03] So without knowing, obviously I'm not in the community, as far as you guys are I feel like you've touched on every part of it.

You've talked about spell versus fell kid and the production side. The only. Like I would be curious just to leave off with, and I think we touched on it a little bit as like a new developer coming in, like a junior, like just leaving college or a bootcamp or whatever to, to takes felt. And we kind of said, maybe don't learn felt for your next job, but definitely, check it out and learn it for your side project or like your blog or something like that.

Is that still pretty accurate? 

swyx: [00:34:36] Yeah, I think so. In, in the same way that react, represents what's in production today, but there's a new generation of tech coming. I think that's felt could be that that future, that glimpse of the future, you definitely want to stay informed of like, what is possible, even if you don't use it every day.

You shouldn't know. What is exciting, what excites the people who are focused on the future? To me, that is swell. That is yes, bill. That is Veet. This whole generation of tooling is, is going to be. A huge differentiator for the next 10 years in, in JavaScript. So yeah, if you're just, if you just graduated from bootcamp, go get that job, no, I'm not gonna stand in your way.

But you should know that you deserve better tooling. And also your, the tools that you use for your side projects should not be the same thing as the tools that you use for work, because there are different scales and Yeah. I mean, you should start choosing the things that make you happy and more productive.

Yeah. That's 

Alex Patterson: [00:35:29] well said. I think that we'll probably leave it there because that's a great ending to this podcast. And then the last thing that we always love to do is a fun part of the pod and we called our perfect picks. So Swyx we, we have your perfect pick. Let me bring it up real 

swyx: [00:35:46] quick here.

Oh, yeah. Oh, it's gonna work so great on the visuals. So this is 3g S journey. It's by Bruno Simon whose personal site actually went viral a couple of years ago, because it's all built in web geo and it's like this, you start as this little race car and you drive it around in three JS. And it's just such a gorgeous sight.

Move your mouse around and look at it, responds. And it basically shows you how to get involved in three JS in a very approachable and French way. He keeps up a lot of French speakers when they only speak English. They know that they have a very heavy accent that makes them a little bit hard to understand.

So they just very apologetic about it. And I watched this video and I'm like, dude, like you already apologize. It's fine. Just say it's gorgeous. It's one of those things where like, at some point, if you do enough with development you're tired of moving boxes around on the screen. It's kind of how I put it and we should look into some of these more interactive and imaginative experiences.

And they're not so far away. I, I'm still, I'm still learning it. I'm just thinking like, there's more to life than just, yeah. Moving boxes around and I think. You have to do the, pay your dues to like learning this stuff to recognize opportunities where you can just like sneak it in to a project.

And it just has the little pop that makes people, enjoy your work a little bit more. Like you can see it's very tasteful that you don't, it's possible to go overbearing with 3d, but it's very tasteful and I just love it. Yeah. 

Alex Patterson: [00:37:04] Fantastic. We use three JS all the time, but it's more just for like graphing and stuff because we're getting paid for it.

We don't have fun stuff to do. That's awesome. Very cool. Brittany, you are up next. 

Brittney Postma: [00:37:17] Yeah. My first pick is the spelt for sites react for apps, blog posts that Shawn actually wrote that we spoke a little bit on earlier. It's a really good blog post that kind of breaks down. Like what's the difference between a website and a web app.

And why does it matter? And. Kind of what he just touched on with like building what you love, like in a language that you like to write. So getting the fundamentals there and then building what you need for the job and what makes you happy? I thought it was a really good post. 

swyx: [00:37:49] That's awesome. Thank you.

And this side is villain spelt and it's open source. So you can check out the code. Yeah, sure. 

Brittney Postma: [00:37:54] Swyx the IO. 

Alex Patterson: [00:37:55] And all the links should be on our blog posts. So. 

swyx: [00:37:59] Check it out. Yeah. I tend to ramble a lot in my blog post. 

Brittney Postma: [00:38:02] My second perfect pick is a little bit of, kind of a shameless plug a little bit because I was on Kobiashi Maru last week and I built a draggable Kanban app with spelt and.

I'm not an expert by any means. And I stumbled through a lot of that and didn't actually even get to implement the draggable part, but there is a link to the get hub repo in there, and we'll link it in our show notes as well. But yeah, it was super fun. And you kind of learn how to persist local storage with a spelt store in that.

So definitely check that out. 

Alex Patterson: [00:38:33] Sweet. Very cool. And then my last pick, I use it every day and I was struggling to come up with a pick today. So I'm like, why wouldn't I pick it? Aandra if, if you don't use it, we use it all the time. Especially in our kind of our cover images and stuff like that. Fantastic work.

I'm totally dropping the name. What's her name? Hang on. I shouldn't give her props. There we go Catarina limpid Sunni. That's why I can never remember it. I had to look at it 

swyx: [00:39:03] now. She does amazing work. 

Alex Patterson: [00:39:04] Yeah. Yeah, absolutely amazing artists. And it's all downloadable, all free to use. Using Algolia to search, she can set our famous, or at least to me, five, five, 1186 purple 

Brittney Postma: [00:39:19] color.

Oh, you even know the hex 

swyx: [00:39:21] value. 

Alex Patterson: [00:39:22] I got to know the hex of a coding cat and you can search through and when you click it on, the cool part is you can download the SVG or PNG the SVG. You can drop directly in Figma and off to the races you go. So, yeah, it's super cool. And you can break it apart. So like I delete stuff out of there all the time just to use the rest of the SVG.

So I 

swyx: [00:39:41] love it. I dropped a link in our notion for more resources, like on draw. So I collect these in a repo that I call a spark joy for basically like all the design resources that always reach for, you should have them ready. And so I dropped it in a notion more places which you can find Andrae is right up there at the top, but there's humans, there's black illustrations Vic TZ, there's just a lot of really great design resources and we should make it easier to access.

So this is my attempt. I'm I'm 

Alex Patterson: [00:40:10] bookmarking all the ones like this directly. I used to have a, an API one like this, there, a gate to like all the open 

swyx: [00:40:17] API APIs scroll all the way down. All the way at the bottom. Yeah. It's just like demo APIs. Cause some of them make you sign up. So I don't like that.

So I actually I'd make the, actually I record the actually free ones. No next there's another one all the way down at the bottom. Yep. There we go. 

Alex Patterson: [00:40:33] Very cool. 

Brittney Postma: [00:40:34] Mark. KPI's. Yep. 

swyx: [00:40:37] Yeah. Nice. Cause I, I used to do a lot of demos from my previous jobs.

Alex Patterson: [00:40:40] I think we're running up on time. So I just wanted to say, thanks again. Swyx for jumping on. I know it's a crazy time where you're at right now, so I really appreciate it. 

swyx: [00:40:50] No, I appreciate the opportunity to talk about spelt. I'm always down to spread the word, spread the gospel, come join the community.

We're pretty active with discord and on Twitter and on YouTube. And then we are holding spot summit in April and it's free. And you just Go to SWAT summit.com I think to drop your email. 

Brittney Postma: [00:41:08] Awesome. Thank you so much. 

Alex Patterson: [00:41:10] Appreciate it. So, yeah. Thanks again. 

swyx: [00:41:13] Take care of me. All right. 

Brittney Postma: [00:41:14] See you later.