Svelte Language Tools with Simon Holthausen

We talk with Simon Holthausen about TypeScript in the Svelte ecosystem as well as the language tools.
Note: This was recorded on February 19th. Sveltesummit CFPs are currently closed.

Sponsors: Support Svelte Radio by leaving a review on iTunes and/or visit our support page.

Description:
We sit down with Simon Holthausen to talk about the Svelte language-tools, TypeScript and all that juicy stuff! Some notes 
Description, show notes and transcription coming soon. This was accidentally released a bit early. Sorry about this!

- Language Tools repo
- Simon on GitHub
- Svelte Component Template

Unpopular opinions:
- Antony: Case-insensitive file systems are bad
- Simon: I use Windows
- Shawn: Don't use throw unless you want the program to crash! Errors are not exceptions!

Picks:

Transcription:
Kevin Åberg Kultalahti  0:00  
Hello, everyone. Welcome to another episode of Svelte radio. Today we have yet another guest surprise. We always have guests these days. But first, some introductions. So I'm Kevin, I run a site called Svelte school. And I'm heavily involved in Svelte society, and help out around the Svelte community.

Shawn  0:22  
I'm Shawn, I am still in the process of switching jobs, but hopefully building a Svelte app in production from a next startup. And I mostly should post on Twitter, first of all society. We also did just launched the CFP for the Svelte summit conference that is going to be happening in April, I think, and I'm very excited about organising speakers for that.

Antony  0:46  
I'm Antony I'm the ccfp og which is a booking system for tourism leisure. I'm also a Svelte maintainer, alongside our guest today, who is Simon halt Hauser. And Simon is the I've got it. What can I say is he's the he's the person in charge of language tools. He's He's the code here behind that is absolutely on fire at the moment. I would probably say it's one of the most active sort of segments of the spell organisation. So all credit to him. And the community, of course. So Simon, I'll let you continue with your introduction.

Simon Holthausen  1:22  
Yeah, thank you for the warm words. I'm some. I work as a software engineer at a company called xo do software development and consulting. And yeah, I, I don't know more by accident than anything. I stumbled into the spelter world got really hyped. helped out getting the language tools, VS code extension forward and yeah. Now I'm a Svelte maintainer, like Antony. And yeah, really? Thanks for having me.

Kevin Åberg Kultalahti  1:57  
Yeah, exciting. So you're you're also known on the Svelte discord as Doom Doom, right?

Simon Holthausen  2:03  
Yeah, right. It's my handle. Yeah.

Kevin Åberg Kultalahti  2:05  
Yeah. Where does that come from?

Simon Holthausen  2:09  
Yeah, so my, my my original nickname back in the days when I was in puberty, was Hitman Faker. I thought that was a very cool name at that time. And after puberty was over, I thought, No, that's, that doesn't work where email? So I thought, Okay, I need a new nickname. And I was humming along like them to them. What kind of pig? And then I thought, Oh, why why not take this? This? Dum dee dum? Yeah. And so it was just like, it's called loudly fire in German. So.

Antony  2:49  
Wow. That was loud.

Simon Holthausen  2:53  
Louder. The word for writing something down? That sounds exactly like you.

Shawn  3:02  
Automatic. Yeah.

Antony  3:06  
Yeah. I was gonna say it's more like Him. There's another word for isn't there. When a word sounds like the thing that it describes, is that Onomatopoeia?

Kevin Åberg Kultalahti  3:19  
This is above my paygrade podcast. Alright, so so TypeScript, what's are sorry, language tools? What's going on there?

Simon Holthausen  3:30  
TypeScript is a big part of language tools. That's definitely right. So yeah, I was, I was here on the on the show about, I don't know, almost a year ago. And I skimmed through some of the issues that we close since then, or we got since then. And yeah, so what changed between then and now. So it's, overall, we just worked hard to get rid of all the edge cases that people might occur when they just coding. And I think, especially all these edge cases, when you when you're in the zone, and you're coding, and then your intelligence does something stupid, that can really put you off, and we are trying really hard to minimise that. new things are about. We also added a lot of new things like we now have auto completion for events. So if you define event by create Event Dispatcher from another component, you get auto completion for that in the component that uses the components. You can get comments for the props and events. So if you hover over it, you see the docks, there were some new refactoring commands like extract into function, which works similar to the JavaScript or TypeScript one. Cool. We got a simple Extract into components refactoring. So you can select a part of a component in the markdown, which you want to extract into a new function. And it just can right click, and then there should be a extract components, add components command in the context menu. And then you can specify what's what's, what's the name of the component, and then it will transfer that HTML into the other component, and write the input for you.

Antony  5:34  
So just just for the somebody who's let's pretend I'm completely uneducated in TypeScript, not because I am no, I definitely am. Imagine if you're also completing events. And you've got like a series of events that click and you've got things like, key up and key down. Are you maintaining a huge list of events that match the Svelte API? Or are you using, say, the type definitions within Svelte to generate those auto completions? How does that how does that work?

Simon Holthausen  6:00  
It works. Actually, it kind of is like that. So that there are two parts to that. One is that we use the HTML language service that VS code uses for its HTML intelligence. And that one defines a lot of those events. So if you do auto completion, you'll get that from that. But we also have to define and keep track of a really big list of all these events inside a type definition file, so that we can show arrows, like, okay, you're using a new event that doesn't exist. So for that we have two people, ever growing list of events.

Antony  6:47  
So you have this duplicate list that matches Svelte, right? Yes, we do. So is there a way to Is there a way to maybe like, use that if that list existed a bit within Svelte itself? Is there a way to use that list from there? Or is that is that not a thing? That's possible?

Simon Holthausen  7:04  
So there was, I don't know some kind of Jason definition, we could definitely look into generating something out of that. Yeah, that would be possible.

Antony  7:13  
That'd be interesting PR, because I've, I've seen the code that adds those events to elements inside Svelte. And it's kind of like a big if statement, really, I'm guessing it's done that way for efficiency, in terms of execution speed. But what I might say is that maybe if we put that into a JSON file and had it as a reference we could look at maybe that would be sort of work better that people save some of that manual overhead.

Simon Holthausen  7:35  
Yeah, yeah, definitely. There are also some other parts like the all the warnings of the Svelte compiler can put out, they are not in one place right now. So, and you cannot turn silence all of them. So, like the accessibility warnings, you can turn off with sobelle to ignore comment. But that doesn't work for all elements. And I think we could look into to get it to work for more elements, or maybe all of the warnings.

Antony  8:12  
I think this is an open, there's an open issue that's kind of being completed over time, which is to move all the errors and warnings into a single place. So I think that might help with that. And I think as interment in terms of silencing the accessibility areas, I know this, I know, there's two ways there's a fired, and I can't remember the reason behind it. But there's basically some of them are belong, they belong to Svelte and can be satisfied roll up and some of them don't belong to Svelte and can't be. And I can't read the exact, exact nature of that, I think maybe one of them. Some of them come from acorn, or they come from some other internal project that we don't have the same level of control over. But yeah, definitely, I think, I think things will move in the right direction to make that maintenance task easier. which requires,

Simon Holthausen  8:57  
definitely,

Shawn  8:58  
I have a bit of a confession, which is I've never used the refactoring commands in VS code or TypeScript. So like, this this stuff with a with the whole, like, refactor out into a component, or was the other one that you said,

Simon Holthausen  9:14  
extract into function something, you select some count block and say, okay, extract that into a function that works in TypeScript, JavaScript, and they are now also works in Svelte files.

Shawn  9:27  
Yeah, and it's something that I think the React world and view also have, it's just that I've never used it like am I supposed to be right clicking things all the time and because I just copy and paste. Like, I I feel like there's productivity tips that I that other people use that I don't know about or I don't use. I get this question. You know, how often How often do people use it? How do you How often do you use it?

Simon Holthausen  9:53  
I honestly I use it all the time I do so many extract into function extract into constant All over the place. I don't know. I, I couldn't live without these refactorings today, I don't know. So much nicer. The same with format. Yeah, ever since I started using prettier I, I am no longer able to format my code by hand. It's I I'm able to.

Kevin Åberg Kultalahti  10:19  
Yeah, I have a love hate relationship with prettier, mostly because I'm stupid and can't configure it correctly, probably. But that's another discussion.

Antony  10:28  
Yes. It's a weird one because I think that I mean, I used to use typed languages a lot. And I really do I do miss the kind of extracting functions and stuff. I sort of resorted to doing it, Mandy now because I don't use TypeScript that much he used JavaScript. But it would be really convenient to start using this again. So I don't know that the list of reasons maybe I should switch to TypeScript just keeps growing, isn't it?

Simon Holthausen  10:50  
Yeah. But these things you can use in JavaScript too? I think. So these extracts, constant function Do you could use those two in JavaScript? So

Antony  10:58  
but this there are some you can't use, right, because they need a bit more. Yeah, I think definition.

Shawn  11:03  
Yeah. So you know, there's been a lot of talking about moving between TypeScript and JavaScript. There's been a lot of discussion about how in Svelte kit, you're using just the GS doc version of TypeScript. Is that true?

Unknown Speaker  11:16  
Right, well, yes.

Shawn  11:17  
I mean, it Yeah. I mean, what are your feelings on that, Simon? And is that something that more people should explore?

Simon Holthausen  11:24  
So I think I'm on the other side of the spectrum, I I really like TypeScript. And I'd like to use it everywhere. And rich, just has a very different opinion on that. So he went with a j. s doc approach, which is perfectly fine. For me, as long as I, I don't know, I, I didn't work myself yet that much with the Svelte code. So I cannot say, Okay, this works just as well with as it worked with TypeScript. So I cannot speak from experience for that. But I think some some part of it will just feel more tedious to me than they would do with TypeScript. Especially around those things like, okay, you have to now define your types inside j. s. Doc. And I'm just more used to typing the types right after a lot in line. And I think that, for me, at least, I mean, it's all coming down to habit and what you're used to, but for me, it just reads better. And I think some some things like generics you cannot describe in a good way with J stock. Or maybe that changed. I don't know,

Antony  12:53  
I think we had we had this, you know, it was originally in TypeScript, the whole thing and, and then rich one day decided that TypeScript was kind of becoming, you know, is problematic for him, as he was changing things quite a lot. And he decided to remove it. While he sort of, you know, he offered up the notion that he'd remove it. And then there was a big a big discussion that lasted days, about, you know, yes, and no, and, you know, there was like, half people in the camp of the maintainers in the camp of no and half of them in Yes, and then lots of I'm ignoring lots of lots of work to kind of try and make it workable. But then, you know, in the end, we like, let's remove it for now and see see how it goes without it, just just whilst it's in this kind of state of massive flux, and then we'll read it later on. And I remember I mentioned to somebody on Twitter that we're gonna, you know, we're going to re add it, it's not a permanent state. And then rich popped up so well, actually. And now he's talking about, you know, making it all as projects at work, just use the desktop stuff, or whatever it is. So I mean, yeah, I don't know, I'm not getting involved. Because I mean, I don't have enough education in in TypeScript to really know how it feels to write the whole project in TypeScript. But I will leave that to just sort of work itself out organically. I think it'll be interesting to see. To see the result of that,

Kevin Åberg Kultalahti  14:08  
that the other people fight. Yeah. All right. So before we go on, I'm gonna read a couple of sponsors bots, which aren't really sponsors, bots, but Alright, so first up, you can now support Svelte radio directly. And by doing so, you'll get access to video versions of the podcast or you'll be able to listen a couple of days early to the episodes. So if that's interesting, you can head over to Svelte radio.com slash support. And, yeah, the the support is much appreciated. And then, if that's not something you're interested in doing, you can always leave a five star review on iTunes or whatever podcast platform you're listening to. also helps out a lot. And yeah, that's it. Whoo. Whoo indeed. All right. So so so what are what are things are new in? In the language tools side, you you've, you've, you sent us a list here a couple of days before about some things. And there's there's one thing called Svelte component typed. So So what's that?

Simon Holthausen  15:22  
Yeah. So that's a new addition to Svelte core. There were quite some requests about, okay, how do I now I can use TypeScript inside my side components, but then I'll have to transpile it to JavaScript to provide it to others as a library. But how do I write type definitions for that? So I need some type definition file. And I need to write down the types and they are and how can I make it so that the language tools will understand those types and will tell the user Hey, this prompt does not exist, or this event does not exist. And so Svelte component type does exactly that. It helps you writing type definitions. So you just do, okay, exports class, then your component name extends spell component type. And then there are three generic parameters, props, events, and slots. And you can type type them all. So we can say, Okay, this, it has these props with these types and these events with these types and same for slots. And that that really should help library authors to to write type definitions more easily.

Kevin Åberg Kultalahti  16:38  
Nice. It's it sounds like a big, big addition. compared to before, yeah, definitely.

Shawn  16:45  
Yeah. I have a question. I have a question, which is like, Where's this documented? Because I feel like people should want to look at code examples.

Simon Holthausen  16:53  
Yeah, documentation is a big, ongoing issue. We, we also talked internally about this quite a lot already. It's, it's, it's kind of all dependent on each other. So we definitely want to redo the docs and also enhance the docs, because there's quite a bit to know about TypeScript specifics by now. And, yeah, we definitely have to put them on the official side. And so that's definitely missing. It's, there are dogs for the inside the language tools. But I mean, they are not directly explorable from the from the official side. So yeah, that's definitely still missing. talks are, yeah.

Shawn  17:39  
Sounds Do you listen to Svelte radio, then you don't need the dogs? Yeah, right.

Kevin Åberg Kultalahti  17:43  
Radio is the dogs. Right. So

Simon Holthausen  17:45  
listen to the dogs.

Kevin Åberg Kultalahti  17:50  
Maybe that's maybe that's the next big thing. Like audio documentation.

Shawn  17:55  
Yeah, actually, there's some people in the AWS ecosystem that actually do like dramatic readings with their dogs. Live Stream, and then there's like, some calming music in the background, and then you just read from beginning to end actually, you learn quite a few things.

Antony  18:08  
I really like that idea. That's a really good idea. Dramatic readings of anything is great, but documentation is even better. Oh,

Kevin Åberg Kultalahti  18:16  
yeah. Speaking of like, traumatic. What do you call it? dramatic readings? Yeah, so I've been reading these. These fantasy books. I think I picked one of them, like a couple of episodes back maybe 10 episodes. Yeah.

Shawn  18:29  
Brandon Sanderson.

Kevin Åberg Kultalahti  18:30  
Yeah, exactly. Exactly. You're so good. It's so much better than like a regular audiobook. I cannot recommend it enough. Sorry. A bit of a tangent there.

Shawn  18:39  
No, it's good. Yeah, like I like to hear that people are still enjoying, you know, stuff that he picked in. Yeah, it's like a double pick.

Kevin Åberg Kultalahti  18:48  
Yeah, yep, definitely. Alright, so. So this thing about documentation, maybe that's also something that's missing a bit in general and Svelte. And I think we say this quite a lot. And it's, it's like, General examples are like, videos by people doing different things. Li Hau has been doing great with the outdoor stuff lately. Those are awesome. But maybe maybe should be priority to get something out on how to do like a proper library with TypeScript and everything set up somehow. I know there's the there's the Svelte template, repo, I think a component. Yeah, component of that. Yeah, exactly. And I haven't touched that in ages. But I assume that can be improved some bit. Maybe it already has TypeScript out of the box. And I'm just not aware of that.

Simon Holthausen  19:46  
There are some open prs to get some some something automated so you can compile to J s from from tears but I don't know if they have landed yet. Because there were some concerns about usage and just in general, yeah. Documentation how to how to use it edge cases when it doesn't work. Yeah. There are only so things one can do at a time.

Kevin Åberg Kultalahti  20:16  
Oh, yeah, definitely. I'm not saying you should do it to say someone should do, or if it was their

Shawn  20:24  
issue 29 on the component template repo, where people are discussing some of the details. With publishing these things. It is pretty complicated sometimes, especially if you need to take in an account SSR.

Kevin Åberg Kultalahti  20:36  
So I think I always like end up scrapping my TypeScript plans, because because I always have trouble setting it up correctly, getting it to work properly with everything else. Probably my main problem with it,

Simon Holthausen  20:51  
that was also one of the main reasons why rich fruit out of swell kit, because there were just so many problems with setting it up correctly in the context of a mono repo. And so Oh, getting rid of tooling is always I mean, no tooling is better than or no build step is better than any pizza. Yes. Yeah. Main notion that I think,

Kevin Åberg Kultalahti  21:19  
yeah, definitely. We we actually. So couple of people created like a Svelte kit incognito Discord server, where we could discuss it without, without like, like, like spamming the regular discord with questions and stuff. Because we know that people don't really want to listen to socket

Antony  21:42  
stuff all the time, right. I like that, like these people, whoever they are.

Simon Holthausen  21:49  
Yeah, it's really it's really crazy to me how many people are jumping on it? so early? It's it's really fascinating. Yeah.

Kevin Åberg Kultalahti  21:57  
New, shiny. Very exciting, though. Anything else about like the Svelte component template we want to discuss Probably not. There's also preprocessor. Support. Right? The or sorry? source map, support

Simon Holthausen  22:11  
source map support. Yeah, that's, that's another thing that landed recently. So Svelte has much better source map support now. And that means that if you now get an arrow, and you're using TypeScript, for example, you will get the error pinpointed to the correct location in the Svelte code, which wasn't the case wasn't always the case previously. And yeah, that that was really a huge community effort. So I don't know it's it was Timmy trash and me law house. I think that those were the handles. And they basically did all the work. And so huge props to them for bringing that in.

Kevin Åberg Kultalahti  22:56  
So like source maps, and and like obfuscating code on the in production, that's something I've like, I've seen a lot of people there, they're asking like, oh, why can I see my my Svelte code in the in the browser on my site? And I personally, I think it's a good thing that you can see it because then you can like, look at how someone else built something. But I feel like this this thing that some, some people think that if you obfuscate the code, you can like figure it out, like someone can copy it somehow. But that's obviously not the case. Right? I'm curious about like, how does source maps does? Does that affect anything else? Like loading times and stuff like that? in general? I don't know enough about it. But they're just loaded. If if you have an error, right?

Simon Holthausen  23:49  
I think so. So so once there's something where the source code location could be looked up, then I think the browser's will try to load it. If it's there. So you if you turn off source maps for your production boats, and you don't get 10, don't deploy the source maps along with with the generated code you? Well, you won't see ya the origin, the court and in the process.

Shawn  24:16  
Yeah, so I've actually had to wrestle with this for a previous project of mine. And there's, there's the security angle. And then there's the the data angle that data angles, pretty simple. This first map is not downloaded unless you have the browser Dev Tools open, which means your dev. So it doesn't make sense to send a source map for a regular user who, you know, has is not going to use it. But having source maps in production is a open question. I think the majority consensus is in favour of it. But there's some people who have the security argument, right, like, if you can see my source code, then you can figure out how my API works. Bah, bah, bah. The argument against that is that if you're relying on that amount of have security by obscurity and you're not being secure at all, your API should be immune to that. And you should, you should not care if anything on your front end is seen by attackers, because that's the easiest part to see. So the argument for putting source maps in production is that when you're developing and you see a bug in production, you can actually, you know, open, open up your dev tools and actually see see what's going on with that. And the other, there's a tool that I'm tracking, which is replay.io, which actually helps you record it's like noon, I don't know if you guys have seen that loom or all these recording tools, bug reporting tools, it records a video, but it's also a custom browser, that plays back the JavaScript code executed, including the source maps. So we have source maps, you enable dev tools like that, that just record all the data passing through, you can pause, and then you know, check, you know if this, this is what I expect it to be, and then continue add comments. And I think it's all enabled by having source maps. So we need to I guess, normalise shipping source maps in production.

Antony  26:05  
Shawn, I'm interested, just 10 genessee hit Tab congenitally here, and generates What do you say? gently? Yeah. I have no idea. I this is not an English language podcast today. I know. I'm too tired. I'm just too tired. No, it's fine. So what I was gonna say is when you say you're tracking something, what does that mean to you? Because it's interesting, as I see, you track a lot of projects.

Shawn  26:37  
So this comes from my background as a finance person, I have investment theses that I that I track, which is like, I think that this could be a huge thing in the future. And I better start collecting data points on this. Because it takes a while for for something, especially things which are in early stages, when you like not really sure if like you should, it's worth your time. It's it's just it's just worth like looking out. Because it just means that I think that this could be big, it's That's all it is. Okay, and I have a mental register of like, you know, last month I saw this this month, I saw that it could it could, it could just not be a thing. And I might just forget about it. But you have to choose what you track and what you ignore, because there's too much to, to know everything about. But I think it's a good idea to not just give up on tracking everything, you should have some idea of like, I think this could be huge. So because you can bet early on it.

Antony  27:30  
I wondered if you had like a, like your own registry of things that you're kind of actively watching or if it's just mentally in your head that there's different aspects, but

Kevin Åberg Kultalahti  27:38  
I'm imagining like a, like a JavaScript, like, like a node script that like opens 50 browser tabs?

Shawn  27:47  
I do. I do actually want repos. I think one of the underrated features of GitHub is that you can just like snoop on notifications of like activity going on in different repos. And yeah, yeah, I think it's a good way to track what's going on without being super involved. But if you see a bunch of activity, you know, like something's going on.

Antony  28:07  
GitHub is kind of missing it missing a trick. And and, you know, maybe maybe not Frydman sort of this is for podcasting. I don't think it is. But I wonder if like the stars feature of GitHub could be a lot better. You know, because you tend to start stuff. And that's it. You start everything. And I've started hundreds of repositories over the years, but it's just a big list. And I can't remember what what's in there what I want to search for. If I could categorise that better. That'd be great. better way of sort of slightly different way of seeing things.

Shawn  28:34  
Yeah. Well, everyone started the language tools repo.

Unknown Speaker  28:38  
Yeah.

Shawn  28:41  
I do that. Like I even even start private repos of my coworkers. So like, I'll go on to my, my co workers repo, and they'll just be one star. But like, at least they see that like, you know, I'm giving them props for like working hard and something. That's

Kevin Åberg Kultalahti  28:55  
nice. Nice, nice, like, surprise. You open your prayer repo and like, ooh,

Shawn  29:01  
it'd be I mean, it's so easy and whatnot. Yeah. I have a question about the refactoring the component refactoring thing. I think there is a movement within Svelte Oh, at least like, Well, okay, I saw, I saw Dan Lieberman from the React team, constantly making digs, and Svelte about how we only have a single file component. And I was, and I think there is some always some discussion about like, multiple files in one component. I don't know how I feel about that. And I was wondering if you had thoughts, because it'll be easier to refactor things into multiple into multiple components, if you could just keep them in the same file.

Simon Holthausen  29:35  
I personally don't like that. I don't know. I don't have an I don't have an issue with many files. And if each file has about, I don't know, 20 lines of code. I'm perfectly fine with that.

Antony  29:48  
Yeah, we I think I'm the same at the same opinion that you know, my ID or VS code makes it so easy to just manipulate a bunch of files at once. I can open them all the same screen I can play around. with them, I would rather have that than pollute the Svelte API with a kind of template tag. The joy of Svelte is it it detects in your components, when you have a script tag, and a style tag, and everything else is HTML. And that's really nice. You know, you don't need these that react style empty tag that you have, or a wrapper component or a root component fragments or so on your fragments. You don't need any of that complexity, mysteriousness, things that break CSS Grid, for example, because you can't, you can't have a direct child have something to make the elements within sight, something agreed or I ran into a problem like that once with those template tags. So I would I would much rather have it just as it is now simple and take the hit that Yeah, you can't put 100 components in a single file. Sure, it might make prototyping very, very slightly slower. But I think that Svelte itself makes prototyping faster. So therefore, you know, it's, in my opinion, at least, it still seems that you're going to get a speed and ease benefit of prototyping and Svelte versus anything else. You know,

Simon Holthausen  31:10  
ya know, what, that you know, that you know, about the extract component command, you can just write your file. Exactly,

Kevin Åberg Kultalahti  31:21  
I'm actually gonna start using it today.

Shawn  31:27  
Simon, since you're sort of the resident TypeScript expert, I was wondering if your thoughts on type scripts, recent features in general, like, there's like the template types, I don't know, they're very fancy.

Simon Holthausen  31:42  
I really love data types. That's, that's, it's a very, very, very interesting feature, the template type templates,

Shawn  31:49  
can you describe them for people who may not know what they are?

Simon Holthausen  31:54  
Basically, it's, you get more, a whole lot more dynamic with typing. And you can describe how a type will be converted to another type, but not from, but not the values. But the keys of those types. So I don't know, for example, let's say you have an interface with Prop A, and you want to define another interface, which has Prop A change, so and you want, you don't want to duplicate that. So you just want to append change, to every prop. And you can do that now with these template, literal template literal types. And it's it's a really interesting feature, I don't think that a lot of people would use it. But I think for library authors, especially it can be really liberating to use that, because it opens up quite a lot of doors for more generic typing. And I also thought about how we could maybe use that in the language tools. I hadn't haven't thought too deeply about it. But there could be some benefits to using that for us as well.

Kevin Åberg Kultalahti  33:11  
So is that is that coming in the 4.2? Release? Or is that?

Simon Holthausen  33:15  
I think it's already it's already available? 74.1? Yeah. Yeah,

Shawn  33:21  
it turns people that people have done really crazy things like, implemented JSON parser with it, and

Simon Holthausen  33:30  
it's crazy. Yeah, what you can do with it that

Shawn  33:32  
basically turns the TypeScript type system into like, a full, I guess, like string parsing, string generation thing. Whereas, you know, in the past types of types would be pretty static. like you'd define them upfront. And that's about it. That's all you can use. Or you'd have to use a generic and call them weird names like T. But

Kevin Åberg Kultalahti  33:53  
it can't it kind of sounds like like when when you see these, like, really cool CSS things that people do. Like they like build complete games and just CSS.

Antony  34:04  
Yeah, the counter CSS counter.

Kevin Åberg Kultalahti  34:07  
Yeah,

Antony  34:08  
I saw Ram. I saw a CSS file in the day, which is like a bunch of balls on a grid that go up and down like that. And it's very little CSS there. It's really impressive.

Kevin Åberg Kultalahti  34:17  
You can do so much in CSS now. It's amazing. You can

Antony  34:22  
you can it's kind of scary, because it's one of those points where it starts to cross over into something that is a language in its own right. You know, and it is the language anyway. But I mean, it becomes it blurs the lines between where JavaScript ends and CSS starts. And I don't know how I feel about that. Really. I quite like the single thing for single purpose style things.

Kevin Åberg Kultalahti  34:44  
Yep. All right. So you you also had a point about hopefully some incoming tears support for es lint for these lint plugin.

Simon Holthausen  34:56  
Yeah, right. And by now it actually landed. So you Please feel free now has Ts TypeScript support web assembly now in what does that mean? That means that with some slight adjustments to your SP es lint config, you can now get es lint checks in your Svelte files if you use TypeScript, which wasn't the case before. They were all wrong. And so before that it only worked for JavaScript inside Svelte files. And now it works for TypeScript files, too. It's great for TypeScript inside Svelte files. Yeah, so that that landed just about two days ago, I think, at the time of this recording. It's nice. I guess it's a little rough around the edges. It's there may be some things that don't work as expected. Someone already did a PR to fix some of those things. And but, uh, yeah, it's it's there, and you can finally use it inside sidebars. So, yeah. I think that's what quite a lot of people. I don't know, in these issues. Some people were like, Oh, I'm blocked from using Svelte until this TypeScript support lands in Yes, lint. I cannot live without that. And so

Kevin Åberg Kultalahti  36:23  
yeah, that's great. It's kind of like those people that were blocked from using Svelte before TypeScript. So any anything any other like, cool things that are going on in the language tools.

Simon Holthausen  36:38  
So so one big thing that we haven't solved yet is that if you if you are inside the Svelte file, you get all these nice IntelliSense features. And you can do a I don't know, you can refactor a prop. And that prop will be renamed in the other Svelte files to, etc. Or you can rename a variable and it also will be renamed in Ts files, which use that. But that doesn't work once you're in a TypeScript or JavaScript file. So once you're in JavaScript, or TypeScript in a file of then just yeah, VS code or the the others just don't know, what's this Svelte file extension? digits just cannot really deal with that. So that crossing the boundary of getting Svelte support in the context of JavaScript or TypeScript files. That's, that's something we haven't accomplished yet. But we we've picked up work on that. So Pushkin has has done some exploration on that lately. And so we're starting to explore that. And hopefully we can, yeah, show show something in that regard. Soon. So what what what that would mean is that if you do a refactoring of I don't know you have, you have a store in a JavaScript or TypeScript file, and you want to rename that store. And with with the with a plug in which we will write for that, you will then would get the Rename working in Svelte five, two. So those will be not only renamed and other j. s, or Ts files, but it will also be renamed in the Svelte files. Or you can say, Okay, I want to see all all usages of that spell component that I have imported as a barrel export, for example, in my TypeScript file right here, and you can just say, okay, find all references inside the TypeScript file. It will also show you the references inside Svelte files, all these things. So just this crossing the boundaries, this is, yeah, this is the thing work in progress, work in progress, right. And the other thing is for for TypeScript, specifically, just getting better. So right now, you you cannot really define, you cannot define generics for props or events, something like that. So I don't know you have a Svelte file. And then you have a prop of a certain type, but you don't care about which type it is. And you have an event event that will be of the same type than the Prop, but you don't know in advance what type it is. And generics would be really good for that. And that hasn't happened yet. So support for that hasn't landed yet. And yeah, fleshing out the API is a ongoing progress to and yeah, hopefully we'll, we'll get agreement on that someday and then that will be part of the Enhance TypeScript support to. Nice. Very cool. So those are the two big work in progress things, I would say. So,

Kevin Åberg Kultalahti  40:12  
so looking into into like the Svelte kit future, how do the language tools work together with Svelte kit in the future? Have you guys discussed anything? Like, will there be specific features in the VS code plugin, for example, that makes things easier and spell kit or something like that?

Simon Holthausen  40:32  
We haven't discussed about this on that level yet. But from a general perspective, it should work just does today with smartphones. So you can use smart kid, just like you can use any other Svelte related project with the language too. So there's, there's no problem there, there may be some special tags that you can set which we will add support for in the language tools. I don't know. But or maybe one could think about, okay, if someone is in a script, context module, and he's starting to type, export const. And then we can maybe provide an auto completion for the loads, interface, something like that. But yeah, those would be things we could could add. But in general, it should just like, work out of the box. Just it works with regular spot.

Kevin Åberg Kultalahti  41:32  
Yep. That's great. All right. Any Any other questions or thoughts about TypeScript? No. All right. So let's, let's go to the next section of the show, which today is domain squatting? So like a couple of weeks ago, I got this weird email from from some company in Shanghai, about some. So I think this was like a domain registrar in in China that emailed me and asking if some random company that tried to register Svelte radio.cn or, and Svelte radio.com, that cn and all these weird variations of the of the server Svelte radio domain name, asking if they were affiliated with me, which I promptly replied and said, No, I have no idea who this is. Or, yeah. That's fine. And then I got like, a another email, which just said, like, yeah, we're not gonna care about what you say. We're gonna register them. Anyway. But so.

Shawn  42:40  
So yeah. We have a petition, or do we have friends in China? Like? Yeah, I

Kevin Åberg Kultalahti  42:46  
don't know. I don't know. If you if if you are the one listening to this, someone out there in the ether, maybe contact us and we can. I don't know. Talk Talk. See?

Shawn  42:58  
Yeah, it's useful in China. We definitely want to talk.

Kevin Åberg Kultalahti  43:01  
Exactly. Yeah. So that's, I was kind of funny thing that happened. Alright, so. So next up, we have the controversial opinions. Right. Controversial opinion. And I'll let the Antony go first, because he, he's the one that started the segment file. Yeah, I've been bit by that's

Antony  43:22  
gonna make your life. Oh, yeah. Yeah. And people getting bitten by it all the time. So people on Twitter, complaining about it, they're losing hours or losing days of time, and it just shouldn't happen at all. And the reason I think that the Mac has the case, insensitivity by default is because it's kind of a historical thing. I think the previous file system before the current one had that had the insensitivity. The new one supports case sensitivity is Unix based, of course it works. But to retain compatibility and predictability, they've made it incentive by default. And I know for a fact that Adobe Photoshop and another Adobe tool, they don't work if you have a case sensitive file system. So you're actually encouraged to format insensitively, which is just infuriating to me. So for developers, that's obviously really super annoying. Definitely not an ideal situation to be in. And I just think I just think that, you know, these tools should be forced to update and Max, you do their standard thing where they they go, Well, this is the future, this starts happening. And that's that. And am I surprised they haven't done it with the case in insensitivity and windows, I mean, witnesses law schools Anyway, let's face it, but basically windows, I don't even think and maybe you can format NTFS to become cases, too, I'm not sure. But it's definitely not encouraged. It's not even common. I can't even imagine a system where that's the case, because I don't think anything would work properly on it. But yeah, so anyway, my point is specific to better cases. tivity is better. They are different files is a different ASCII code is a different byte. You know, it's not at all the same file name, even for human, if it reads the same, it's not the same file. Yeah. So that bad. Love it.

Kevin Åberg Kultalahti  45:11  
Yep. That was nice, nice, nice rant.

Simon Holthausen  45:17  
I think at least in this between us for you, you have a popular opinion right there. Yeah and unpopular.

Kevin Åberg Kultalahti  45:25  
Something like that.

Antony  45:26  
I wonder how the two Mac users I wonder how that's formatted there?

Unknown Speaker  45:30  
That's a good question.

Shawn  45:32  
I just never rename a file. So I don't have to do.

Kevin Åberg Kultalahti  45:36  
Yeah. I actually, I did run into this issue, like, not too long ago, like, I saw a file that was a lowercase and it just irritated me so much that I had to, like, fix it.

Simon Holthausen  45:51  
Yeah, we had the same situation with a readme file. Someone made your case, and the other one was all uppercase, and it causes so much confusion.

Antony  46:03  
Are you are you on Windows? Yes, I am. Some.

Simon Holthausen  46:07  
Maybe that's my windows know that. You said Oh.

Shawn  46:15  
So why should developers use Windows?

Simon Holthausen  46:17  
Why should I honestly, I just haven't used Linux or Mac yet. I refuse to go into Mac land. I don't know. It's just the lock, in effect. seems too big for me. And it's also twice the money for everything. Yeah, the performance with these m one chips sounds sounds promising. But apart from that, I don't know. I just haven't encountered any performance issues coding wise. Now I think that I guess it just has also gotten better over the years for Windows. And if you really want to use Linux, you can just use the the Linux subsystem for Windows. So you can basically have a Linux inside your windows and instal nodes and all your stuff in there and run it from there if you want to. I tried it out. But yeah,

I don't know. I had, it didn't give me the benefit. It just worked. Well, enough for me on Windows. So

Antony  47:26  
yeah, yeah. It's not Yeah, it's not the same that the substance is obviously not the same. And Windows is definitely better than it used to be. I only really use Windows now when I'm installing a laptop to sell or something like that. Or repairing someone else's computer. It's still To me, it's a bit chunky dunk is why I'd call it

Unknown Speaker  47:46  
Shawn conducted on

Antony  47:48  
like, an extension of the word shonky, which added if it's a common word, but it means like a big fat cap, a bit sort of thrown together, in feel it feels like a sort of patchwork quilt of stuff over the years piled up, especially when in comparison to Linux. And I think like, you know, I can see it as somebody who has used Windows and Windows only that it works reasonably well. Right. It's it's sort of straightforward. But you know, having moved over to Linux, probably 14 years ago, now, I think the UI in Windows is incongruent, compared to the one in Linux, like, everything looks the same. in Linux, it's nice, it's consistent font sizing, it's consistent UI. You didn't have these random tools by all your Wi Fi card manufacturers that pop up and try and take over your Wi Fi. Setting the controllers. It just

Kevin Åberg Kultalahti  48:35  
sounds like you've had just like a pirate who are really bad experiences with it.

Simon Holthausen  48:39  
Yeah, I for me, definitely. I don't know. I

Kevin Åberg Kultalahti  48:44  
I, especially my family

Simon Holthausen  48:46  
reasons for not going to Linux is for me is the UI. So? I don't know, it just looks so bad. I don't know.

Antony  48:57  
I mean, that don't forget the role, like, you know, probably five or six mainstream users for the next year.

Simon Holthausen  49:00  
That's true. I mean, I just be complete ignorance on my side. And there are some beautiful Linux desktop you eyes.

Antony  49:10  
If you haven't used it is fair, like, you know, especially when if you were to just start using it one day, you'd probably find it extremely infuriating. It took me eight months of forcing myself to use it before I started to love it. And then now I'll never go back. It's it. It's it's a long journey, like a mindset change from Windows, I would say.

Shawn  49:29  
Any, ever question as a follow up question? Do you use edge chrome? The same as on Windows, right? for work?

Simon Holthausen  49:37  
for work? I use Chrome, but I really thought about switching to edge just because it's chromium based now. But in private, I use Firefox. Oh, yeah. Very cool.

Shawn  49:50  
Can I ask this because the reason I ask is because like, I actually tweeted this a while ago and it was pretty funny. This is the full stack Microsoft challenge because you're already using VS code. You TypeScript, you're using GitHub. And then the you know, then there's a bunch of others that you can use like Bing, OneDrive, Microsoft to do Microsoft OneNote. Azure, of course,

Simon Holthausen  50:09  
Microsoft Edge.

Shawn  50:11  
your laptop could be surface, your phone could be surface duo. And then the big one is a gaming mic you can use you can play Minecraft on Xbox. That's There you go.

Antony  50:23  
That is me for Windows. I really feel that. That's mental. Yeah. Yeah. I mean, I have to say that, you know, for example, I would have probably, historically never use anything. Microsoft base, but you know, vs. Code is fantastic. It really is good. I used to use probably atom I think before that. And it just moved to VS code. It's fantastic. So there's not you know, they're, they're not the company used to be, and they definitely do some good stuff. It's just for me when this is one of those things,

Kevin Åberg Kultalahti  50:51  
you know, all right. Other unpopular opinions?

Shawn  50:56  
I've got a quick one, I guess. Yeah, I've been learning goal recently from a new job. And I realised that other languages handle exceptions and errors differently than JavaScript. And I did not know that there was any other way to do this, because my only prior exposure was Python and JavaScript. And they treat them the same the exact same way. But in go, or let's say, in rust, you don't really throw unless you really like, shit is hitting the fan and the error, the programme needs to end right now. Whereas in JavaScript, it's pretty normal to throw whatever error you want, right? And then you just expect someone you document that someone above should catch you, you expect someone to catch you somewhere, and then the programme is going to recover and continue from an error. And so I, I realised this when I yeah, I was just like, you know, exploring, like, what is what's the difference between errors and exceptions, like, I don't know, if you guys have ever thought about it,

Antony  51:51  
I have thought about it. Because in Java, where I originally came from, there you go, it's two very different concepts, right. So it's an error, sorry, an exception is something quite normal. It's an exception to the flow of the programme or the circumstance you're in. And you can even do exception Driven Programming, which I used to do quite a lot where you just have, so Java has very good exception catching, it doesn't have like JavaScript, we have to inspect what kind of code it is, or read some text of the message. It has explicit types around what you're throwing, so you can make a catch date with multiple catches, and just save this type to this, this type do this. So an error in Java is the thing that if you throw an error in Java, your programme quits, that's the end, right? And error is critical is your system is always never used them. Yeah, when you're programming regularly, you never really use them, you shouldn't use them, especially web apps. But for an exception exception is quite a normal thing. And it literally means the truest term, it's an exception to the flow you expect to be happening.

Shawn  52:54  
Yeah, so I mean, that that was what it took me a long while to actually get there. Because I've never used Java. And then the other thing that was confusing was go actually names them the opposite way around. So exceptions are errors, and then errors or

Antony  53:08  
panics. That's complex.

Shawn  53:13  
Really, really screwed me up. But anyway, the the unpopular opinion is you should not use throw in JavaScript, unless you can really, really avoid it, you should use you should return an error. Or you should return in some sort of error object. I see Simon, give me a thumbs up that.

Simon Holthausen  53:27  
Yeah, definitely. That

Antony  53:28  
is a hard a hard wiring, rework of my brain if I have to do that.

Shawn  53:33  
Because it's normal to throw but we should not be randomly knowing like that. Yeah, it's not it's an abusive throw.

Simon Holthausen  53:39  
I mean, that, yes, at the end, for example, functional programming with this, either. So you either return the normal thing or something, that exception so so to speak. And then you're forced to handle that all the way up the chain. But I think that's also why it hasn't gotten so popular. Because if you have to explicitly handle it every time, which is generally a good thing. I think many people are just lazy and say, Okay, I'm just gonna throw a try catch somewhere very Yeah. up the chain, and just deal with it there instead of having to pass around this either. All the way up. But I think I think would make for much, much more robust code, and more predictable coders think if you if you're programming

Antony  54:33  
it, yeah, I mean, if you're writing a language, like you said, you know, if you make it too different to everything else out there, you split the camp into two types of people as those who will adopt it and change that programming habits which should be few. There are people who will just ignore it completely because it's so different to what they used to. And then there'll be the fanatics who absolutely just love it. The fact is everything differently.

Kevin Åberg Kultalahti  54:55  
They'll just again, be a small campus and just describe the the Elm language Quite well,

Antony  55:00  
quite possibly I've not looked at quite possible,

Shawn  55:04  
either or maybe.

Kevin Åberg Kultalahti  55:05  
Yeah, no nuts. Yeah, but

Shawn  55:07  
you know. And then, for me, the final realisation was that anytime you throw within the anything async. And the moment you have, you know, you call promise and you forget to catch that error just like goes out the window you've never handled that doesn't exist.

Antony  55:24  
And most the time, I think,

Shawn  55:27  
once I actually got mad at JavaScript, I was like, wow, like, this is the reason we have shitty programmes in JavaScript is we don't we don't have really good discipline around error handling. Anyway, that's my that's my unpopular opinion.

Unknown Speaker  55:39  
You should you should stop.

Kevin Åberg Kultalahti  55:42  
Alright, yeah, I have. I don't have an unpopular opinion. So I'll hop right on to the pics. And good my pic today is a yubikey five seed nano. That's a mouthful. It's like one of these security keys that you can plug into your computer. And so you use that instead of a two factor authentication. Or it I guess it is your two factor authentication? Let's see. There you go. And I have

Antony  56:11  
Yeah, yeah,

Kevin Åberg Kultalahti  56:12  
I don't think so. So I have mine. plugged in all the time it takes takes up like no space at all. And instead of having to, like bring up my phone and get this, Google Authenticator, authy or whatever app you're using, you just touch the device and you're, you're locked in, which is nice.

Antony  56:31  
What if you What if you lose it? What happens?

Kevin Åberg Kultalahti  56:34  
Yeah, that's a problem.

Unknown Speaker  56:40  
Yeah,

Kevin Åberg Kultalahti  56:40  
no, no, no, but there are solutions to it. I just haven't really, like,

Shawn  56:48  
you know, either. Sorry for them. Some people cut out the tips of their thumb and then put their yubikey there. So you just plug it in.

Kevin Åberg Kultalahti  56:57  
That's disgusting.

Antony  57:00  
Crazy. My friend actually did that when he was when he was like, 16 or whatever the first drive. He dug, he dug the palm of his hand out and stuck an RFID chip in there so we could lock his car by waving at it.

Kevin Åberg Kultalahti  57:12  
No, I mean, it's the future. cyberpunk future. So just gonna prepare for this. All right, any other pics? You guys?

Antony  57:23  
Yeah, my pick is so I do I do enjoy, run quite a lot. And I think rum is a wonderful drink. I really like it agreed. And the only problem with rum of course is it's full of alcohol. And unless you're a pirate, you can't really sit around drinking it all day. However, I've recently discovered, there's a whole explosion in the UK of spirits that don't have alcohol in them. So you can get loads of different gins lots of lots of white spirits, you can get sort of gins and vodkas that have, you know, they kind of have sort of plant based stuff in them and they flavour the drink a bit a bit like alcohol, but it quite tastes like alcohol if you drink them need their tastes absolutely vile. I found one recently called clean R, which is basically a sort of alcohol free rum. It's 1.2% it's not alcohol free, but it's 1.2%. That's so interesting. I

Kevin Åberg Kultalahti  58:11  
read this in the in the docs, and I thought it was like some weird cleaning product.

Antony  58:17  
It's not I mean, it's maybe maybe it's a body cleaning product. I don't know. But it's Yes, it's a rum rum style or rum based, or I don't know what they call it like it like a rum alternative, I suppose. And if you again, if you drink it neat, because you have to try it neat. So it's like it just tastes like water, which is very odd. It's like drinking shots of water. Like that's very strange. But when you mix it with Coke, it really does emulate that kind of rum and coke tastes really really well so weird. And I think it's because it's actually mostly fragrance. It's like It's like it gives it that kind of smoky tobacco we kind of currently smell and that obviously part of your taste is smelling it and it works really well. It's almost like drinking rum and coke even always has that kind of alcohol that you get. So I was quite impressed with it because a lot of these these new on the market and alcohol free drinks are just terrible. seedlip especially is absolutely vile is disgusting. Even if you mix it with what they say you should mix it with it tastes like absolute rubbish. So I'm really happy with this clean code clean our run type spirit, which is just fantastic.

Unknown Speaker  59:24  
Nice. Cool, cool. Cool.

Shawn  59:26  
I got a quick one if somebody's still thinking of one. So it is The Princess Bride home movie. Which is I didn't I didn't know about this but during the pandemic, the a lot of celebrities wanted to encourage people to stay home. So they actually recorded sort of word for word performance of Princess Bride but like on their personal cameras with no props, like it's very like crappy quality but with all the stars that you might see like Diego Luna and Jon Hamm Don't ever don't i don't even know like, it's like it's like the most number of stars you've ever seen in a single movie. And then they reenact it Princess Bride. It's pretty funny. It's a classic movie if you haven't seen it already. And I just really enjoyed it. It was one of the only good things that came out of kwibi which is the very short lived

Kevin Åberg Kultalahti  1:00:16  
mobile Oh, that was the network. Oh, right. The moment the mobile like,

Shawn  1:00:20  
video work thing, TV network thing that Jeffrey Katzenberg, very arrogantly raised 2 billion for and burned it to the ground in two years billion

Kevin Åberg Kultalahti  1:00:28  
$2 billion on a startup. It's amazing.

Shawn  1:00:31  
And yeah, it is pretty funny. Like his his arrogance, but like could be produced this thing. And this thing is hilarious. So there's the one good thing that came out of quibi

Kevin Åberg Kultalahti  1:00:42  
gonna check it out. Right, let's pick. Do you have something fun?

Simon Holthausen  1:00:46  
Yeah, my pick is not a thing. But it's a bit. It's an event. It's Fasching. So it's, it's Fasching in German? It's it's roughly carnival.

Unknown Speaker  1:00:58  
which

Simon Holthausen  1:00:59  
hasn't happened this year, of course, because of COVID. But I don't know, as a kid I was. You just dress up you you? Didn't you dress up as something else, like a cowboy or something. That's what I did back in the day. And it was always really fun. And I mean, over time, that excitement diminished a little, but it was always really fun to to at least go to these parades where they had all these waggons where they have sculpt to make make fun of politicians or things. And that all that hasn't happened yet. Not yet. But this year, and I don't know you just know that what you miss until you don't have it. So yeah. I really hope that by next year, this time, we could have fasching again and yeah, so that's this is my pick this day.

Creators and Guests

antony 
Host
antony 
Dad / @SvelteJS maintainer / @SvelteSociety co-founder / Svelte Radio host. Born at 341.57 ppm CO2.
Brittney
Host
Brittney
DS Eng @Provihq 🧜https://t.co/U8JoqVO4Sm 😺https://t.co/5FKTbGIW8d 👩‍🏫 https://t.co/wGvIldEAIe
Kevin A. K.
Host
Kevin A. K.
Co-founder of Svelte Society 🌎 Organizer of Svelte Summit 🏔 Host of Svelte Radio 📻
Svelte Language Tools with Simon Holthausen
Broadcast by