Svelte Summit 2020, Sapper is getting some love and Elder.js is really cool!
This week we announce the new online conference Svelte Summit as well as talk about Elder.js - an amazing new static site generator.
This week we announce the new online conference Svelte Summit as well as talk about Elder.js - an amazing new static site generator. Oh! And some good news. From this episode and on, we have an editor and the episodes will be transcribed.
Sponsors:
Links:
Picks:Transcription:
EPISODE 09
[INTRODUCTION]
[00:00:00] KA: Hey, everyone. Welcome to another Svelte Radio Podcast. This week, we don’t have a guest. But as usual, the three of us are here. So, I’m Kevin. I run a site called Svelte School, where you can find tutorials and the training material to learn Svelte. And I’m joined by my two other cohosts, Shawn and Anthony. Do you want to go ahead and present yourselves?
[00:00:28] SW: Hey, everyone. This is Shawn. I guess I have to do some self intro. I work at AWS as a senior developer advocate, and happy to be here.
[00:00:38] AJ: I’m Anthony, and I the CTO of Beyonk, which is a booking platform, book software for experiences and travel. And I am also a Svelte maintainer.
[00:00:49] KA: Amazing. So since last time, what have you guys been up to? Have you done anything interesting?
[00:00:57] SW: Well, I can go while you guys think of your updates. I can only think about the things that I’ve been doing recently, which is not doing Svelte. So kind of the biggest community React Conference is called React Rally, and it’s happening tomorrow. And I spent the last two weeks essentially – Well, this is Svelte related. I’ve created Svelte for React. Basically, the way that you do immutability and sort of assignment in Svelte, you can actually just point that over to React. I did that. And then I made a whole talk around it with the whole idea of like why you should be experimenting with different formats and stuff like that.
Preparing any talk is big, but I think this conference is special to me because that’s how I first stated. That’s my first ever conference in 2018. That’s the first talk I ever gave. And I owe a lot to that conference. So I wanted to do a good job.
[00:01:54] AJ: Yeah. From my point, it has been 38+ degrees here in the UK and it’s very hard to work and very hard to think in that kind of heat. And specially we don’t have air con in our houses and stuff like that. So it’s just a matter of – I don’t even know. There’s no way to stay cool. But meanwhile, I’ve been obviously working hard in my startup, which is Beyonk. And then we’ve been doing a fair bit of Svelte work. So mostly that and making contribution a bit easier. Getting some PRs closed and that sort of thing. Yeah, all kind of very software-related and the crazy heat.
[00:02:39] KA: Okay. So I’ve been working these last few weeks on the new Svelte Society Day website as well as the upcoming conference that we’re going to talk about in a bit. Spoiler alert. Then today we are also going to talk about some other stuff. There’s new static side generator. Routify just released their 2.0 release, and a couple of other random things.
Let’s get started. First off, Svelte Society Day France. I heard they had like a lot of proposals.
[00:03:17] SW: Yeah, they did better than you. They’ve got some proposals so far. I’m not sure when this is going to release, but they’re aiming to close proposals on 16 of August. But they have a good selection. It’s always better to have more, I think. And I think the actual event is happening at the end of September. If I was any good at this job, I would have their URL in front of me. It’s actually france.sveltesociety.dev. Basically, if you speak French and you do Svelte, you should come to this meet-up, or conference, or whatever it is, on the 27th of September, and it will be a good time.
[00:03:54] AJ: I think it’s worth noting. We’re talking about it in Discord and they were saying that sort of majority French talks, but not exclusively. So they might have some English language talks as well.
[00:04:05] KA: Yeah. I was going to say, I’m going to check it out even if I don’t speak French.
[00:04:11] AJ: Yeah. Yeah, exactly. There might be opportunity there if you don’t speak French. They’ll also still – They’ll join in and participate and sort of learn some stuff.
[00:04:18] KA: Yeah. All right. The big one, Svelte Summit 2020. This is the new conference. Yeah.
[00:04:28] AJ: With the shiny, shiny site.
[00:04:31] KA: Exactly. By the time you listen to this, the website is going to be alive, and you’re going to find it on three different URLs. But mainly I would probably go to sveltesummit.com. So this is pretty much the new Svelte society day, but with a shinier name, cooler website and more speakers, hopefully. We’ll see. We’ll be opening the call for proposals as soon as this podcast goes out.
[00:05:00] AJ: But what sort of talks are we looking for for these companies?
[00:05:04] KA: That’s a good question. If you’re interested in doing a talk, I would submit it regardless of the subject pretty much as long as it’s Svelte related, of course.
[00:05:15] AJ: And then we can come to Discord and chat about any of the proposals in the society chat.
[00:05:21] KA: Exactly.
[00:05:23] AJ: And what sort of length are we talking about talk quite here? Are we doing sort of lightning talks or we’re doing longer talks or –
[00:05:29] KA: I’m thinking we should have both lightning talks and regular talks. So a lighting talk would probably be something like 10 minutes-ish. But longer ones, 30 maybe. It’s not a hard limit on like how long or short the episodes can be. Sorry. The talks.
[00:05:46] AJ: Basically it’s good because it’s kind of like an opportunity to somebody who hadn’t talked before maybe to have their first talk? But it’s prerecorded I’m guessing. I mean, it theoretically makes it a bit easier, but also maybe doesn’t always make it a bit easier.
[00:06:02] KA: Yeah. I noticed that last time. But this time, we’re going to do it a bit differently.
[00:06:07] AJ: Sure.
[00:06:08] KA: We’ll do a YouTube premier kind of thing.
[00:06:11] AJ: Nice. Yeah. Yeah.
[00:06:12] KA: One thing we haven’t mentioned is the date. It’s on the 17th of October, I think. Day 18th.
[00:06:22] AJ: This is critical information, right?
[00:06:25] KA: Yes. I need to check this out. It’s the 18th. Good thing I double checked.
[00:06:36] AJ: Cool. I will indeed be preparing a talk. I just have to figure out exactly what, because it’s lots of different things.
[00:06:43] KA: Yeah.
[00:06:43] SW: Yeah. I mean, I wonder if I should do that or maybe I should just take it easy for this –
[00:06:50] AJ: You should give a talk.
[00:06:52] SW: We’ll see. We definitely want new voices and new faces, especially people of color and women and that’s something that I’m very keen on as well. So to have more representative voices. Yup.
[00:07:03] KA: Yes, for sure. All right. So we’re going to take a short break and we’ll be back in a bit.
This is the first sponsor of the show, Mono Company. Mono is a digital product studio that works remotely. And within the Svelte community, you might have heard of Wolfr. He coincidentally made the Svelte Summit website design, and he’s worked on the Routify website as well as the actual Svelte Society website. And he wanted to sponsor this episode with a simple message. As a design team, they’re open for new clients and they have extensive experience designing web applications with full-on custom design systems. Mono is typically responsible for the UI and UX in a project and they work alongside developer teams. They love designing web apps and they want to support Svelte, because it’s an awesome framework.
Checkout their website, it’s mono.company. That’s M-O-N-O.company.
[00:08:10] SW: That’s a pretty nice URL. Yeah. I mean, his designs just look amazing and he just does it so quickly. It’s pretty cool.
[00:08:18] KA: Yeah. It is amazing. I don’t understand how he can do it so quickly.
[00:08:24] SW: Yeah. I think designers who can develop or developers who can design are just – They can do so much with so little resources. It’s really cool to watch. Thank you, Mono, for being our first sponsor.
[00:08:37] AJ: We met one of merged contributions into the site yesterday and it’s great, because it’s fixed that long-standing issue on the Repl and iPhone where you have to scroll down to get the input-output toggle on. And it’s fixed that. It’s beautiful. I could now code on my iPhone, which is great.
[00:08:52] KA: Yeah. That always bugged me a bit to like scroll up of it. Yeah.
[00:08:57] AJ: Well, it’s fixed. It’s done.
[00:09:00] KA: That leads into our next topic. The last Svelte Maintainers Meeting.
[00:09:05] AJ: Yeah. So you may have noticed in the last couple of weeks, three weeks or so, the maintenance status of Svelte and Sapper has increased dramatically. Obviously, it’s a kind of combination of the ratings we’ve had so far. Also the addition of [inaudible 00:09:21]. I want to give Ben [inaudible 00:09:22] a shout. He’s a machine. I don’t know how he has time to do all these stuff he dies. But if you can think of something, there’s a PR for it already. He’s opened it and it’s ready to merge, right? It’s crazy. He’s also would be working through and triaging and checking and testing all the existing PRs. A really good addition to the maintenance team there, and I think everyone’s kind of been sort of inspired by that. And so obviously you see the tractions. You see things going in and it kind of eases kind of the block a bit more. Great stuff. He’s yet to join us in a maintainer’s meeting. The last one was where we discussed adding him.
What came up the last maintainer’s meeting was a focus on Sapper. Obviously, Sapper was sort of sidelined for a long time just whilst we got Svelte up to a place where we wanted to be. The goal – Sort of the future of Sapper is there’s a lot of talk about modularizing it. Maybe not even having a thing called Sapper, but turning it into a series of roll-up plugins that make up Sapper. So like a routing plugin. A plugin for the kind of internals, bundling, the splitting. This is all underway. There’s a Discord user called Adam B. or AJ Boo on GitHub as well. He’s actually kind of started this prior to us even discussing this. I don’t know how well his stuff aligns with kind of the main vision.
I’m supposed [inaudible 00:10:47] of writing RFC on how to split this. But I found that it takes a lot of time to write an RFC. So it’s kind of been delayed. Meanwhile, he’s doing a lot of things that I kind of wanted to anyway, which is great. Yeah, that’s the plan for Sapper, to modularize it and do a lot of other cool stuff and maybe make it kind of have differential root bundling so you can have fully static routes, dynamic routes, SBA routes, SSG routes, you name it. Yeah, that’s going to be a series of stuff that’s going to be appearing as RFCs in the hopefully near future.
Meanwhile, we’re just cleaning up everything else around Sapper. Probably half the PRs that were there are now closed. I think merge didn’t close, which is great. Yeah, looking pretty rosy. Then we’ll have to focus on Svelte again, because now Svelte is becoming the one that’s get sidelined.
[00:11:37] KA: It’s usually our goals, right?
[00:11:39] AJ: Yeah. Exactly. Yeah. And then the next maintainer’s meeting I think should be in one or two weeks away. Yeah, and I can’t tell you exactly what the topics are for that. But we do have quite a lengthy list of topics that will break back reports.
[00:11:53] KA: Yeah, lots to talk about. So little time.
[00:11:56] AJ: Well, you could say a little time to talk about it and even less time to do it. So, again, hugely relied upon the contributions from the community. Nice, clean PRs coming in. Looking pretty good.
[00:12:09] KA: That’s awesome. All right. Shawn, do you have anything to add to the –
[00:12:14] SW: No. I think to the extent that we have some sort of roadmap. I think it’d be good to publish it. Make the Svelte blog a little bit active. And in terms of – I hate to say it, marketing, having some sort of conscious – Effort to have minor versions and actually tell people like, “Okay. There’s a new minor versions. These are the things that we added.” Stuff like that. Is there a change log? I don’t even know if there’s a change log.
[00:12:39] AJ: Yeah, there’s a change log [inaudible 00:12:40] maintainers the change log.
[00:12:43] SW: Okay. Yeah, we can publicize that a bit more.
[00:12:46] AJ: Yeah. We probably should publish it, the change log. We probably should tweet about it. I might even see if we can clone the society auto-tweeting thing from GitHub. If we can make it part of that or something. However, what I will say about roadmaps is that they can be a double edge sword. Whilst it’s great that people can see and have disability over what, the plans or where they’re going. They also become a kind of tie in a commitment. With the amount of stuff that people are doing and working on, there’s less time and less time to actually make these changes especially when they’re quite large. I think there’s the fear of having a roadmap that maybe is stale or where things have just sat forever and never moved. It’s definitely a consideration, but there are reasons that there isn’t one in any sort of formal sense as of yet.
[00:13:36] KA: Cool. Cool. Cool. So, Routify 2.0. I don’t know how much you know about this release, but apparently it’s not as big of a deal as it sounds. It’s just that some of the changes are breaking.
[00:13:52] AJ: Okay.
[00:13:53] KA: There are some small editions, but nothing major. I think Jake is working on this new framework, Roxi.
[00:14:03] SW: Roxi?
[00:14:03] KA: Roxy. Yeah, R-O-X-I. I suspect we’ll hear about that in a couple of weeks maybe.
[00:14:10] AJ: I mean, Roxi, from what I understand, it’s like modular Routify, right?
[00:14:14] KA: I’m not entirely sure exactly what it is. I’ve been a bit out of the loop these last few weeks, but I guess we’ll hear about it. That also made me think about Roxi. Is that like what do you call it when you switch around the letters? Anagram? Is that what it’s called?
[00:14:30] SW: Yeah. Yeah. Anagram.
[00:14:31] KA: Yeah. Is Roxi an anagram for Rixo?
[00:14:35] AJ: Oh, yeah. Maybe.
[00:14:39] KA: I don’t know. I’ll have to investigate.
[00:14:43] SW: Well, for those who are less well-versed, what is Rixo?
[00:14:47] AJ: Yeah.
[00:14:49] KA: Yeah. Rixo is a person. He maintains the Svelte HMR kind of thing and he made a project called Svench as well. It’s like the storybook equivalent in Svelte lang.
[00:15:05] AJ: Yeah. Rixo is HMR guy, is what I call him. He’s a guy who comes and he claims to be some sort of junior and he’s just kind of looking at the HMR implantations and copying them. I’m like, “Yeah. Okay. That’s not junior.” What he’s done is mind-blowing in HMR. It’s just really good, and I’m using HMR in a lot of projects now. In fact, that’s one of the reason I’m using Routify, because I’m using Svite, which uses the HMR plugin underneath and it uses Routify. And it works really well. It works really nicely. It’s a very impressive piece of work.
[00:15:38] KA: For sure.
[00:15:40] SW: Yeah. I mean, I’ve been trying out Svite as well. And in order to – So Svite is built on top of Vite, whatever. And in order to write Svite, he had to figure out how to write a Vite plugin, which is not documented. So then you just have to dive through the codebase of Vite and figure it out. And he did, and it’s pretty impressive. I don’t know how to do that. So kudos to him.
[00:16:08] AJ: Yeah. Dominik is also and one of those just doing stuff that didn’t seem possible.
[00:16:14] KA: Yup. All right. Next topic is a new static site generator, Elder.js. So you guys haven’t used it much. I tried it a big. It was jure released. The name is quite odd, Elder.js. It’s because of the company that released it. It is called ElderGuide, which I don’t even know what you want to call it. Like elderly home review kind of site.
[00:16:47] AJ: Yeah. It’s like a care home review site.
[00:16:50] KA: Yeah. That’s right. So the documentation is on that site, which is funny. So you can – Like the top menu shows you like, “Oh, check out the nursing homes, etc.” It’s kind of funny. Anyway, what are the features of Elder.js? Elder.js is kind of like – It boasts like insanely fast build times. I think he mentioned something like building 17,000 pages in like 8 minutes, which is mind-blowing fast. He also seems like one of those guys that just does the impossible sort of.
The idea is basically that you set up your data fetching mechanism beforehand. You can hook into the build process at different times and you can manipulate the outputted HTML and so on. One of the major features that I kind of like is the partial hydration. He’s using a preprocessor to look at the components. And if there’s a certain attribute on there, it makes it interactive. And otherwise, it just keeps it statically generated, which is kind of nice. So you can have, for example, a forum that’s interactive but the rest of the site is just static. Makes it so it doesn’t ship double the code.
[00:18:20] AJ: It’s pretty impressive.
[00:18:22] KA: Yeah. The docs are really good. I think he spent like several days writing these docs.
[00:18:29] AJ: I mean, it’s a good way. It’s a good way to kind of write docs for yourself as well, isn’t it? To remind you when you can back to it after a while. Yeah, for sure. Docs can be almost a freebie.
[00:18:39] KA: Yeah. I tried writing a plugin for this static site generator, and it’s just like a regular RSS feed data fetching plugin and it was really easy. Like super, super easy. I would probably like compare it a bit more to Gatsby than Sapper. But it’s not exactly the same. It doesn’t necessarily use GraphQL, for example. Yeah.
[00:19:06] SW: Yeah, it doesn’t. My comments on this thing – I mean, anytime someone else writes a static side generator. That means I don’t have to do it. That’s really great. And this is a very significant effort that he did not have to open source, but took the extra time to share it and it’s pretty cool. Yeah, I’m seriously considering rewriting my own site using this, because it addresses the core criticism that people who criticize JavaScript frameworks have, which is when you do the hydration on your site, you’re basically sending it on the HTML and then you’re sending it on the data and then you’re sending on a JavaScript and then you’re re-rendering all that in JavaScript.
That seems silly for something with a site that has mostly static content. I think that’s true even for Svelte. But it’s also true for React. So the solution is actually something that Jason Miller from Google has been calling the Islands Architecture. So that’s on his site at jasonformat.com/islands-architecture. And it’s this idea that, “Okay, you have a site. It’s got a header. It’s got a sidebar. It’s got a middle content page. It’s got a footer.” And guess what? Only parts of the site needs to be interactive. The rest is just static content.
So the way that we did it before JavaScript frameworks was essentially like, “All right. We’ll throw in some JQuery and then we’ll do some interactive element and event listeners to those parts of the site.” And then when we transitioned to writing sites using frameworks, we kind of lose that, because we try to rehydrate everything so we have consistency. I think Elder helps to return us to that mode. Because Svelte is such a nice authoring format for collocated like styles and templates, and then maybe JavaScript, right? I think Elder just like kind of assumes that by default, it will only output HTML and styles and it will be kind of scopes styles to that HTML component. And then if you want JavaScript, you have to opt-in by adding this attribute, like you said, which is the hydrate-client, and then that’s an indication to Elder.js that, okay, everything under this part you can hydrate using JavaScript. But it makes for a very, very, very small components and they can all be sort of loaded independently. I think that’s the main innovation here that I don’t it exists in other frameworks. I think this is a world-first, and this is pretty cool.
[00:21:36] KA: Yeah, I like it a lot. The reason I built the RSS plugin was to make the new website for this podcast actually. So I’m going to try building something cool in Elder.js to make the website a bit more active and better.
[00:21:54] AJ: Sounds good. Sounds good. I haven’t got a use for static site generator at the moment, but it’s definitely something that I want to do, because I just have this dream of having a super high-performance site written in Svelte. That’s slightly a dream. I mean, the sites I have now are fast, but they’re obviously dependent upon APIs and that sort of thing. Yeah, maybe one day, hey.
[00:22:17] KA: So many things to try out and test.
[00:22:20] SW: Yeah. I think everyone should have a personal blog that they update. I think everyone should write more. And site generators are just a good application of that. So, someday. I know you’re a busy guy.
[00:22:34] AJ: Yeah.
[00:22:34] KA: Yeah. Svelte in production.
[00:22:36] SW: So, people, we try to collect cases of people using Svelte in production partially to like encourage others to like give them some social proof that like other people who are actually using this and its production ready. The only way – This question of like is Svelte production really? I mean, it’s kind of an arbitrary standard. And the only way to really answer that is to show that people are using it in production and then gradually to people over the edge.
It’s the pin tweet on the Svelte society Twitter, twitter.com/sveltesociety. And I just have a bunch of people that might be notable. They are recognizable household names, and if people kind of report their apps as well. This kind of like a nice narrative compliment to the who is using Svelte part of the Svelte read me. It’s on a read me, right? Or is it just the site?
[00:23:28] AJ: I saw the site on that. Yeah.
[00:23:30] KA: Yeah.
[00:23:30] SW: Oh, it’s on a site? Okay. Because like the who’s using Svelte page is just a bunch of logos. I think it’s good to have like stories of like where? So like an internal app or is it like customer-facing? We talked about in previous episodes like Disney and Square Enix, and [inaudible 00:23:50] Cloud, and Elder as well. Google used it recently for an arts – Like a crossword experiment. It’s not the main Google, but kind of like the Google apps or whatever they call it.
I think the big news that happened I think this week, actually, yesterday, was that Alaska Airlines self-reported that they’re Svelte for a pretty good use case. Alaska Airlines, it’s a pretty major airline in the US. I fly it whenever I’m on the west coast. And I was like, “Well, that’s interesting. Where do you use it?” And this is what they said. They said, “We’re using it in a new microsite we built to help guests when their flight is disrupted. The guest is often at the airport when they get the notification. So they have slow connection speeds. We chose Svelte to keep our JS payload low.
[00:24:36] AJ: I think it’s worth [inaudible 00:24:37]. One is you mentioned about the logos on the homepage. That’s actually come up in both maintainer’s meetings. It’s something we want to optimize and we haven’t got a really good idea of how to do it. There’s a notion of maybe having some sort of headline apps kind of like big sites that use it. And then everyone else kind of below or maybe deferred to another page or something like that. Maybe randomizing logos goes to so many of them. That’s something we’d gratefully receive as a PR or a least a discussion on how we could better do that, and my idea is throw it apart maybe. So if there’s someone looking for a first contribution, that’s a very good place to start.
And the other thing is about, yeah, using something in production. Is something being production-ready? A question we get a lot is when will Sapper reach version 1.0? When is Svelte version 4 coming out? The problem with this to me, and I say it every time, is that a version number doesn’t really mean anything in terms of whether something is a recent production-ready. I’ve been using Svelte since anyone even heard of it, apart from Rich and a few others, right? And I’ve pushed it to production at that point before it’s even got any traction at all. I’m not a person who follows version numbers very carefully.
But what I will say is that try and cast aside the notion of a version number or a stable or a major or anything like that. Decide what you want to do with framework X. Write lots of tests. Build prototype. Build spikes. Test it out. Asses it against other frameworks or the things you got and just kind of assert that it can fulfill in a reasonable way all the things that you want to do. And that’s only real way that you can determine whether something is production ready or not. If you’re relying on an arbitrary version number [inaudible 00:26:29] production ready or not, you’re in for a big shot. So I really disagree with the kind of tie between version numbers and readiness, or appropriateness, or fitness of purpose.
[00:26:42] KA: Wasn’t it node that had like the longest like 0. something release thing up until like just a few years ago? I don’t remember.
[00:26:54] AJ: Yeah. I mean, there’s also – It did. It certainly sort of went from 0.12 or something to 1. But there’s also a movement. I can’t remember what it’s called. But it’s something like never reach version 1.0. And it’s a group of people. Rightly or wrongly, I think [inaudible 00:27:12] is great. I’m not sure I agree with it in concept. But it’s a group of – A movement of people who want to never ever make their projects reach version 1.0. And they just encourage bumping their minor every time. And I think like it’s probably a bit tongue and cheek. But the underlying message is exactly what I’ve said is about. Don’t fixate on version numbers, because they’re meaningless. They mean different things for every person. They’re meaningless as a thing.
[00:27:39] SW: Yeah. I was also going to mention, part of the reason I try to track people using Svelte in production is because that is step one to then having jobs for people who want to use Svelte, right? That is kind of the funnel that goes towards that. There used to be [inaudible 00:27:55] called Svelte jobs on Twitter. That seems to be inactive now. I actually don’t even know who operates it. But we shouted out some major players. Recently, like Apple did some contracting work at Svelte.
[00:28:09] AJ: There’s quite a few huge names, but it’s just not everyone announces it I guess.
[00:28:13] SW: Yeah. Well, we’re not going to know everything. But I think just to create a community. I think it’s kind of like a weird cycle. Like you have to pay people to put Svelte, to care about Svelte, to put Svelte in production that feeds into people actually relying on this thing and contributing back to community, and that just kind of builds the virtuous cycle.
[00:28:35] AJ: Yeah. It’s chicken and egg.
[00:28:36] SW: It is. So, I just want to shout out that there is an opportunity this week from Open Zeppelin. We’re looking for a security platform engineer. It’s kind of like a full stack opportunity. So they do blockchain and Svelte. That’s a very interesting combination, which are very, very cutting edge. Presumably, you want to get very small JS bundles on your Etherium blockchain. I’m making this up. But, yeah, the reason we track these things in production is to build the ecosystem, and I think that’s pretty important.
[00:29:11] KA: Yeah. Okay. So we’re going to take a short break and listen to one of our sponsors.
Have you ever wondered where you can learn more about Svelte? How to actually use Svelte? You’ve probably heard about a site called Level Up Tutorials. It’s run by a guy called Scott. He makes tutorials about all sorts of things web related. And recently he’s been pretty interested in Svelte. So he’s made a Svelte tutorial and a separate tutorial, as well as I think Sapper and Meteor sort of thing. I’m not too sure. I don’t know much about Meteor, but it sounds cool. If you want to learn more about Svelte and how to use it, go to svelteradio.com/levelup and you’ll end up at the website with some nice tutorials.
[00:30:05] SW: Yeah. I think it’s like a monthly or annual subscription and it’s kind of all you could eat in terms of his videos. And there’s a lot of just frontend-y, full stack-y content. He’s a full stack developer. He’s just records very high quality videos. If you want to check a sample of his stuff out, definitely check his YouTube channel, where he posts a lot of content for free. And I think it’s a good way to level up, like I said.
[00:30:31] KA: Good way to level up. Yeah. All right. So, Svelte on MDN.
[00:30:38] SW: Yeah. I put this in there. So MDNs recent [inaudible 00:30:40]. It’s still a very important site. And I think something that people don’t really know is that MDN doesn’t just cover like – It’s not just documentation for web APIs from browser fenders. It actually is a community contributed kind of like wiki type of thing. And it covers anything. And that includes frameworks as well. And OpenSaaS. I don’t know his real name. I don’t know if he’s like anonymous or something. But yeah, open SaaS has been working really hard on the Svelte tutorial on MDN, and it’s coming along. I think it’s on part 6, but 7 chapter out of 8. And he’s even covering – Like the type support with Svelte. That’s feels old now. But it’s still pretty new. Yeah, I think he’s looking for contributors. But then you can also just now check out chapters 1 through 7 of the MDN Svelte tutorial and contributive learning.
[00:31:38] AJ: And I think that’s still in the kind of beta state? That’s still ready for final review. So if anyone’s got anyone feedback on them or input, then let OpenSaaS know, and they can be updated.
[00:31:50] SW: Yeah. OpenSaaS is pretty active in like I think the Spanish Svelte community.
[00:31:56] AJ: Yeah.
[00:31:56] SW: Yeah. That’s all I know about it.
[00:32:00] KA: It’s good that this is a thing though. I didn’t know like MDN had information or stuff on frameworks. It’s the first time I heard about it.
[00:32:11] AJ: Yeah. It’s a surprise to me too, but it’s good.
[00:32:17] SW: I think that they recently adapted Vue for the MDN site itself, and that was a mildly controversial decision. But yeah. I mean, they’re friends with frameworks.
[00:32:27] KA: Yeah. It makes sense. Okay. That was our last on topic topic, I guess. So let’s move into picks and other stuff.
[00:32:39] SW: Cool. So we’re going to picks?
[00:32:41] KA: Yeah. Let’s do that. I got to think of a pick.
[00:32:46] AJ: He’s going to find a pick really quickly.
[00:32:50] SW: Oh. Okay, I got one. I got one.
[00:32:52] KA: Go for it, Shawn.
[00:32:54] SW: Okay. So I’ve been getting into live streaming. I started a live stream with a friend of mine, Thor, from Stripe. His name is Thor, which is great. He even has like a hammer. Yeah. Yeah. It’s like the AWS and Stripe live stream. It’s every Monday at noon eastern time in the US, which is midnight our time. But the main joy that we discovered is Stream Yard. That’s I think is streamyard.com, and it’s this browser-based version of OBS. If you’ve done any live streaming, OBS is pretty ubiquitous. But I think the problem with OBS is that it’s kind of like hard to configure. Stream Yard is basically OBS with good defaults and it helps you multicast to a bunch of different popular venues. So I can broadcast across Periscope, YouTube, LinkedIn, Facebook and Twitch. But the main ones are YouTube, Twitch and –
[00:33:53] AJ: You can live stream on LinkedIn?
[00:33:58] SW: Yeah, I think so.
[00:34:01] AJ: LinkedIn stories. I mean, LinkedIn stories.
[00:34:03] SW: Yeah, you can broadcast on LinkedIn. Yeah. LinkedIn page, LinkedIn event, LinkedIn profile. It’s amazing how easy it is to hook up. It’s amazing how easy it is to organize like multiple people coming in and you got to organize their location on the screen and do screen sharing as well. All of that usually burns up a lot of CPU on my machine and it makes my machine very slow. But if you offload to Stream Yard, then it’s not that slow. It was just a very pleasant experience. I think this company is like a tool version shop in I think Norway or maybe Sweden. I don’t remember. But it’s a Nordic country. It’s just like a nice tool. Yeah, it’s free for basic usage. So, check it out.
[00:34:47] AJ: You can go and visit them, Kevin. You can go and visit them in Sweden.
[00:34:51] SW: When corona dies down.
[00:34:55] AJ: Yeah, right.
[00:34:55] KA: Unless it’s in Stockholm, then I can go, I guess. So my pick is – It’s actually a board game. Last week, I played a board game called the Gloom Haven with a couple of friends. It’s sort of like a Dungeons and Dragons style game. Super fun if you’re into co-op board games. Yeah, that’s about it. Check it out.
[00:35:21] AJ: I like good board games. So I’m going to have a look at that. Wow! It’s expensive. Whoa!
[00:35:25] KA: Yeah. But like the box weighs like 10 kilograms. It has so much stuff in it.
[00:35:31] AJ: Led must be expensive by that – Cool. Okay. So my pick is going to be actually games as well, but more online. So I don’t actually play very many online games. In fact I don’t play any games at all. But I do play with friends especially during lockdown, the Jackbox Suite of Games. If you haven’t hear of the Jackbox Suite of Games, it’s essentially a bunch of kind of multiplayer games. One of the most famous ones being Drawful, which is a lot like Pictionary. You all draw something on your phone. So you stream it via a broadcast kind of [inaudible 00:36:08] Google Meets or whatever and then you draw on your phone a picture. And then everyone has to guess what that is a picture of, and then at the end you see everyone else’s answers and you pick the one that you think is the correct answer. And they’re quite abstract topics. So it’s not easy to see what the original was, and the drawings are very bad because they’re on your phone. So it makes it a lot of fun. We spent – We stream with these games almost every week, if not twice a week. Absolutely loads of fun. My parents can play them. You don’t need to sort of be into gaming or anything to do it. And then they’ve got six party packs now. So there’re six sets of 6 to 8 games. There’s quite a lot to choose from. All sorts of trivia and quiz like that, things like that too. Essentially, it requires one person to have the games, stream their screen over a video showing service and then you can do YouTube or Twitch or whatever. And every one that wants to joins in just uses their phone. They go to the Jackbox TV website and they type in the rim code and then they’re member of the game.
You can actually go on Twitch and you can search for Jackbox and you’ll see a bunch of people playing these games all the time. If you want to kind of get a little preview before you dive in and actually buy them. But they’re really good. I really recommend it for catching up with friends whilst just stuck in your house.
[00:37:22] KA: All right. I guess that’s it. Thank you every one for listening. We’ll be back in another couple of weeks, I suppose. And yeah, take care. Bye.
[00:37:32] AJ: Cool. Thanks a lot. Bye.
[00:37:33] SW: Bye.
[END]
Sponsors:
- Mono is a digital product studio that works remotely. Within the Svelte community you might know Wolfr he is a designer that worked on the Routify, Svelte Society day and Svelte Summit website. He wanted to sponsor this episode with a simple message: as a design team, they are open for client projects. They have extensive experience designing web applications with full-on custom design systems. Mono is typically responsible for the UI and UX in a project and they work alongside developer teams.
- Level Up Tutorials brings you cutting-edge, focused & high quality video tutorials for web developers and designers. Check out the Svelte For Beginners as well as Sapper for Beginners courses.
Links:
- Svelte Society Day France - September 27th, 13 talks!
- Svelte Summit is on October 18th - CFP and Sponsors can apply now!
- Routify 2.0
- Roxi
- Elder.js - A new crazy-fast static site generator built for SEO and many other use-cases. Partial hydration using Jason Miller's Islands Architecture
- Svelte Tutorial on MDN
Picks:Transcription:
EPISODE 09
[INTRODUCTION]
[00:00:00] KA: Hey, everyone. Welcome to another Svelte Radio Podcast. This week, we don’t have a guest. But as usual, the three of us are here. So, I’m Kevin. I run a site called Svelte School, where you can find tutorials and the training material to learn Svelte. And I’m joined by my two other cohosts, Shawn and Anthony. Do you want to go ahead and present yourselves?
[00:00:28] SW: Hey, everyone. This is Shawn. I guess I have to do some self intro. I work at AWS as a senior developer advocate, and happy to be here.
[00:00:38] AJ: I’m Anthony, and I the CTO of Beyonk, which is a booking platform, book software for experiences and travel. And I am also a Svelte maintainer.
[00:00:49] KA: Amazing. So since last time, what have you guys been up to? Have you done anything interesting?
[00:00:57] SW: Well, I can go while you guys think of your updates. I can only think about the things that I’ve been doing recently, which is not doing Svelte. So kind of the biggest community React Conference is called React Rally, and it’s happening tomorrow. And I spent the last two weeks essentially – Well, this is Svelte related. I’ve created Svelte for React. Basically, the way that you do immutability and sort of assignment in Svelte, you can actually just point that over to React. I did that. And then I made a whole talk around it with the whole idea of like why you should be experimenting with different formats and stuff like that.
Preparing any talk is big, but I think this conference is special to me because that’s how I first stated. That’s my first ever conference in 2018. That’s the first talk I ever gave. And I owe a lot to that conference. So I wanted to do a good job.
[00:01:54] AJ: Yeah. From my point, it has been 38+ degrees here in the UK and it’s very hard to work and very hard to think in that kind of heat. And specially we don’t have air con in our houses and stuff like that. So it’s just a matter of – I don’t even know. There’s no way to stay cool. But meanwhile, I’ve been obviously working hard in my startup, which is Beyonk. And then we’ve been doing a fair bit of Svelte work. So mostly that and making contribution a bit easier. Getting some PRs closed and that sort of thing. Yeah, all kind of very software-related and the crazy heat.
[00:02:39] KA: Okay. So I’ve been working these last few weeks on the new Svelte Society Day website as well as the upcoming conference that we’re going to talk about in a bit. Spoiler alert. Then today we are also going to talk about some other stuff. There’s new static side generator. Routify just released their 2.0 release, and a couple of other random things.
Let’s get started. First off, Svelte Society Day France. I heard they had like a lot of proposals.
[00:03:17] SW: Yeah, they did better than you. They’ve got some proposals so far. I’m not sure when this is going to release, but they’re aiming to close proposals on 16 of August. But they have a good selection. It’s always better to have more, I think. And I think the actual event is happening at the end of September. If I was any good at this job, I would have their URL in front of me. It’s actually france.sveltesociety.dev. Basically, if you speak French and you do Svelte, you should come to this meet-up, or conference, or whatever it is, on the 27th of September, and it will be a good time.
[00:03:54] AJ: I think it’s worth noting. We’re talking about it in Discord and they were saying that sort of majority French talks, but not exclusively. So they might have some English language talks as well.
[00:04:05] KA: Yeah. I was going to say, I’m going to check it out even if I don’t speak French.
[00:04:11] AJ: Yeah. Yeah, exactly. There might be opportunity there if you don’t speak French. They’ll also still – They’ll join in and participate and sort of learn some stuff.
[00:04:18] KA: Yeah. All right. The big one, Svelte Summit 2020. This is the new conference. Yeah.
[00:04:28] AJ: With the shiny, shiny site.
[00:04:31] KA: Exactly. By the time you listen to this, the website is going to be alive, and you’re going to find it on three different URLs. But mainly I would probably go to sveltesummit.com. So this is pretty much the new Svelte society day, but with a shinier name, cooler website and more speakers, hopefully. We’ll see. We’ll be opening the call for proposals as soon as this podcast goes out.
[00:05:00] AJ: But what sort of talks are we looking for for these companies?
[00:05:04] KA: That’s a good question. If you’re interested in doing a talk, I would submit it regardless of the subject pretty much as long as it’s Svelte related, of course.
[00:05:15] AJ: And then we can come to Discord and chat about any of the proposals in the society chat.
[00:05:21] KA: Exactly.
[00:05:23] AJ: And what sort of length are we talking about talk quite here? Are we doing sort of lightning talks or we’re doing longer talks or –
[00:05:29] KA: I’m thinking we should have both lightning talks and regular talks. So a lighting talk would probably be something like 10 minutes-ish. But longer ones, 30 maybe. It’s not a hard limit on like how long or short the episodes can be. Sorry. The talks.
[00:05:46] AJ: Basically it’s good because it’s kind of like an opportunity to somebody who hadn’t talked before maybe to have their first talk? But it’s prerecorded I’m guessing. I mean, it theoretically makes it a bit easier, but also maybe doesn’t always make it a bit easier.
[00:06:02] KA: Yeah. I noticed that last time. But this time, we’re going to do it a bit differently.
[00:06:07] AJ: Sure.
[00:06:08] KA: We’ll do a YouTube premier kind of thing.
[00:06:11] AJ: Nice. Yeah. Yeah.
[00:06:12] KA: One thing we haven’t mentioned is the date. It’s on the 17th of October, I think. Day 18th.
[00:06:22] AJ: This is critical information, right?
[00:06:25] KA: Yes. I need to check this out. It’s the 18th. Good thing I double checked.
[00:06:36] AJ: Cool. I will indeed be preparing a talk. I just have to figure out exactly what, because it’s lots of different things.
[00:06:43] KA: Yeah.
[00:06:43] SW: Yeah. I mean, I wonder if I should do that or maybe I should just take it easy for this –
[00:06:50] AJ: You should give a talk.
[00:06:52] SW: We’ll see. We definitely want new voices and new faces, especially people of color and women and that’s something that I’m very keen on as well. So to have more representative voices. Yup.
[00:07:03] KA: Yes, for sure. All right. So we’re going to take a short break and we’ll be back in a bit.
This is the first sponsor of the show, Mono Company. Mono is a digital product studio that works remotely. And within the Svelte community, you might have heard of Wolfr. He coincidentally made the Svelte Summit website design, and he’s worked on the Routify website as well as the actual Svelte Society website. And he wanted to sponsor this episode with a simple message. As a design team, they’re open for new clients and they have extensive experience designing web applications with full-on custom design systems. Mono is typically responsible for the UI and UX in a project and they work alongside developer teams. They love designing web apps and they want to support Svelte, because it’s an awesome framework.
Checkout their website, it’s mono.company. That’s M-O-N-O.company.
[00:08:10] SW: That’s a pretty nice URL. Yeah. I mean, his designs just look amazing and he just does it so quickly. It’s pretty cool.
[00:08:18] KA: Yeah. It is amazing. I don’t understand how he can do it so quickly.
[00:08:24] SW: Yeah. I think designers who can develop or developers who can design are just – They can do so much with so little resources. It’s really cool to watch. Thank you, Mono, for being our first sponsor.
[00:08:37] AJ: We met one of merged contributions into the site yesterday and it’s great, because it’s fixed that long-standing issue on the Repl and iPhone where you have to scroll down to get the input-output toggle on. And it’s fixed that. It’s beautiful. I could now code on my iPhone, which is great.
[00:08:52] KA: Yeah. That always bugged me a bit to like scroll up of it. Yeah.
[00:08:57] AJ: Well, it’s fixed. It’s done.
[00:09:00] KA: That leads into our next topic. The last Svelte Maintainers Meeting.
[00:09:05] AJ: Yeah. So you may have noticed in the last couple of weeks, three weeks or so, the maintenance status of Svelte and Sapper has increased dramatically. Obviously, it’s a kind of combination of the ratings we’ve had so far. Also the addition of [inaudible 00:09:21]. I want to give Ben [inaudible 00:09:22] a shout. He’s a machine. I don’t know how he has time to do all these stuff he dies. But if you can think of something, there’s a PR for it already. He’s opened it and it’s ready to merge, right? It’s crazy. He’s also would be working through and triaging and checking and testing all the existing PRs. A really good addition to the maintenance team there, and I think everyone’s kind of been sort of inspired by that. And so obviously you see the tractions. You see things going in and it kind of eases kind of the block a bit more. Great stuff. He’s yet to join us in a maintainer’s meeting. The last one was where we discussed adding him.
What came up the last maintainer’s meeting was a focus on Sapper. Obviously, Sapper was sort of sidelined for a long time just whilst we got Svelte up to a place where we wanted to be. The goal – Sort of the future of Sapper is there’s a lot of talk about modularizing it. Maybe not even having a thing called Sapper, but turning it into a series of roll-up plugins that make up Sapper. So like a routing plugin. A plugin for the kind of internals, bundling, the splitting. This is all underway. There’s a Discord user called Adam B. or AJ Boo on GitHub as well. He’s actually kind of started this prior to us even discussing this. I don’t know how well his stuff aligns with kind of the main vision.
I’m supposed [inaudible 00:10:47] of writing RFC on how to split this. But I found that it takes a lot of time to write an RFC. So it’s kind of been delayed. Meanwhile, he’s doing a lot of things that I kind of wanted to anyway, which is great. Yeah, that’s the plan for Sapper, to modularize it and do a lot of other cool stuff and maybe make it kind of have differential root bundling so you can have fully static routes, dynamic routes, SBA routes, SSG routes, you name it. Yeah, that’s going to be a series of stuff that’s going to be appearing as RFCs in the hopefully near future.
Meanwhile, we’re just cleaning up everything else around Sapper. Probably half the PRs that were there are now closed. I think merge didn’t close, which is great. Yeah, looking pretty rosy. Then we’ll have to focus on Svelte again, because now Svelte is becoming the one that’s get sidelined.
[00:11:37] KA: It’s usually our goals, right?
[00:11:39] AJ: Yeah. Exactly. Yeah. And then the next maintainer’s meeting I think should be in one or two weeks away. Yeah, and I can’t tell you exactly what the topics are for that. But we do have quite a lengthy list of topics that will break back reports.
[00:11:53] KA: Yeah, lots to talk about. So little time.
[00:11:56] AJ: Well, you could say a little time to talk about it and even less time to do it. So, again, hugely relied upon the contributions from the community. Nice, clean PRs coming in. Looking pretty good.
[00:12:09] KA: That’s awesome. All right. Shawn, do you have anything to add to the –
[00:12:14] SW: No. I think to the extent that we have some sort of roadmap. I think it’d be good to publish it. Make the Svelte blog a little bit active. And in terms of – I hate to say it, marketing, having some sort of conscious – Effort to have minor versions and actually tell people like, “Okay. There’s a new minor versions. These are the things that we added.” Stuff like that. Is there a change log? I don’t even know if there’s a change log.
[00:12:39] AJ: Yeah, there’s a change log [inaudible 00:12:40] maintainers the change log.
[00:12:43] SW: Okay. Yeah, we can publicize that a bit more.
[00:12:46] AJ: Yeah. We probably should publish it, the change log. We probably should tweet about it. I might even see if we can clone the society auto-tweeting thing from GitHub. If we can make it part of that or something. However, what I will say about roadmaps is that they can be a double edge sword. Whilst it’s great that people can see and have disability over what, the plans or where they’re going. They also become a kind of tie in a commitment. With the amount of stuff that people are doing and working on, there’s less time and less time to actually make these changes especially when they’re quite large. I think there’s the fear of having a roadmap that maybe is stale or where things have just sat forever and never moved. It’s definitely a consideration, but there are reasons that there isn’t one in any sort of formal sense as of yet.
[00:13:36] KA: Cool. Cool. Cool. So, Routify 2.0. I don’t know how much you know about this release, but apparently it’s not as big of a deal as it sounds. It’s just that some of the changes are breaking.
[00:13:52] AJ: Okay.
[00:13:53] KA: There are some small editions, but nothing major. I think Jake is working on this new framework, Roxi.
[00:14:03] SW: Roxi?
[00:14:03] KA: Roxy. Yeah, R-O-X-I. I suspect we’ll hear about that in a couple of weeks maybe.
[00:14:10] AJ: I mean, Roxi, from what I understand, it’s like modular Routify, right?
[00:14:14] KA: I’m not entirely sure exactly what it is. I’ve been a bit out of the loop these last few weeks, but I guess we’ll hear about it. That also made me think about Roxi. Is that like what do you call it when you switch around the letters? Anagram? Is that what it’s called?
[00:14:30] SW: Yeah. Yeah. Anagram.
[00:14:31] KA: Yeah. Is Roxi an anagram for Rixo?
[00:14:35] AJ: Oh, yeah. Maybe.
[00:14:39] KA: I don’t know. I’ll have to investigate.
[00:14:43] SW: Well, for those who are less well-versed, what is Rixo?
[00:14:47] AJ: Yeah.
[00:14:49] KA: Yeah. Rixo is a person. He maintains the Svelte HMR kind of thing and he made a project called Svench as well. It’s like the storybook equivalent in Svelte lang.
[00:15:05] AJ: Yeah. Rixo is HMR guy, is what I call him. He’s a guy who comes and he claims to be some sort of junior and he’s just kind of looking at the HMR implantations and copying them. I’m like, “Yeah. Okay. That’s not junior.” What he’s done is mind-blowing in HMR. It’s just really good, and I’m using HMR in a lot of projects now. In fact, that’s one of the reason I’m using Routify, because I’m using Svite, which uses the HMR plugin underneath and it uses Routify. And it works really well. It works really nicely. It’s a very impressive piece of work.
[00:15:38] KA: For sure.
[00:15:40] SW: Yeah. I mean, I’ve been trying out Svite as well. And in order to – So Svite is built on top of Vite, whatever. And in order to write Svite, he had to figure out how to write a Vite plugin, which is not documented. So then you just have to dive through the codebase of Vite and figure it out. And he did, and it’s pretty impressive. I don’t know how to do that. So kudos to him.
[00:16:08] AJ: Yeah. Dominik is also and one of those just doing stuff that didn’t seem possible.
[00:16:14] KA: Yup. All right. Next topic is a new static site generator, Elder.js. So you guys haven’t used it much. I tried it a big. It was jure released. The name is quite odd, Elder.js. It’s because of the company that released it. It is called ElderGuide, which I don’t even know what you want to call it. Like elderly home review kind of site.
[00:16:47] AJ: Yeah. It’s like a care home review site.
[00:16:50] KA: Yeah. That’s right. So the documentation is on that site, which is funny. So you can – Like the top menu shows you like, “Oh, check out the nursing homes, etc.” It’s kind of funny. Anyway, what are the features of Elder.js? Elder.js is kind of like – It boasts like insanely fast build times. I think he mentioned something like building 17,000 pages in like 8 minutes, which is mind-blowing fast. He also seems like one of those guys that just does the impossible sort of.
The idea is basically that you set up your data fetching mechanism beforehand. You can hook into the build process at different times and you can manipulate the outputted HTML and so on. One of the major features that I kind of like is the partial hydration. He’s using a preprocessor to look at the components. And if there’s a certain attribute on there, it makes it interactive. And otherwise, it just keeps it statically generated, which is kind of nice. So you can have, for example, a forum that’s interactive but the rest of the site is just static. Makes it so it doesn’t ship double the code.
[00:18:20] AJ: It’s pretty impressive.
[00:18:22] KA: Yeah. The docs are really good. I think he spent like several days writing these docs.
[00:18:29] AJ: I mean, it’s a good way. It’s a good way to kind of write docs for yourself as well, isn’t it? To remind you when you can back to it after a while. Yeah, for sure. Docs can be almost a freebie.
[00:18:39] KA: Yeah. I tried writing a plugin for this static site generator, and it’s just like a regular RSS feed data fetching plugin and it was really easy. Like super, super easy. I would probably like compare it a bit more to Gatsby than Sapper. But it’s not exactly the same. It doesn’t necessarily use GraphQL, for example. Yeah.
[00:19:06] SW: Yeah, it doesn’t. My comments on this thing – I mean, anytime someone else writes a static side generator. That means I don’t have to do it. That’s really great. And this is a very significant effort that he did not have to open source, but took the extra time to share it and it’s pretty cool. Yeah, I’m seriously considering rewriting my own site using this, because it addresses the core criticism that people who criticize JavaScript frameworks have, which is when you do the hydration on your site, you’re basically sending it on the HTML and then you’re sending it on the data and then you’re sending on a JavaScript and then you’re re-rendering all that in JavaScript.
That seems silly for something with a site that has mostly static content. I think that’s true even for Svelte. But it’s also true for React. So the solution is actually something that Jason Miller from Google has been calling the Islands Architecture. So that’s on his site at jasonformat.com/islands-architecture. And it’s this idea that, “Okay, you have a site. It’s got a header. It’s got a sidebar. It’s got a middle content page. It’s got a footer.” And guess what? Only parts of the site needs to be interactive. The rest is just static content.
So the way that we did it before JavaScript frameworks was essentially like, “All right. We’ll throw in some JQuery and then we’ll do some interactive element and event listeners to those parts of the site.” And then when we transitioned to writing sites using frameworks, we kind of lose that, because we try to rehydrate everything so we have consistency. I think Elder helps to return us to that mode. Because Svelte is such a nice authoring format for collocated like styles and templates, and then maybe JavaScript, right? I think Elder just like kind of assumes that by default, it will only output HTML and styles and it will be kind of scopes styles to that HTML component. And then if you want JavaScript, you have to opt-in by adding this attribute, like you said, which is the hydrate-client, and then that’s an indication to Elder.js that, okay, everything under this part you can hydrate using JavaScript. But it makes for a very, very, very small components and they can all be sort of loaded independently. I think that’s the main innovation here that I don’t it exists in other frameworks. I think this is a world-first, and this is pretty cool.
[00:21:36] KA: Yeah, I like it a lot. The reason I built the RSS plugin was to make the new website for this podcast actually. So I’m going to try building something cool in Elder.js to make the website a bit more active and better.
[00:21:54] AJ: Sounds good. Sounds good. I haven’t got a use for static site generator at the moment, but it’s definitely something that I want to do, because I just have this dream of having a super high-performance site written in Svelte. That’s slightly a dream. I mean, the sites I have now are fast, but they’re obviously dependent upon APIs and that sort of thing. Yeah, maybe one day, hey.
[00:22:17] KA: So many things to try out and test.
[00:22:20] SW: Yeah. I think everyone should have a personal blog that they update. I think everyone should write more. And site generators are just a good application of that. So, someday. I know you’re a busy guy.
[00:22:34] AJ: Yeah.
[00:22:34] KA: Yeah. Svelte in production.
[00:22:36] SW: So, people, we try to collect cases of people using Svelte in production partially to like encourage others to like give them some social proof that like other people who are actually using this and its production ready. The only way – This question of like is Svelte production really? I mean, it’s kind of an arbitrary standard. And the only way to really answer that is to show that people are using it in production and then gradually to people over the edge.
It’s the pin tweet on the Svelte society Twitter, twitter.com/sveltesociety. And I just have a bunch of people that might be notable. They are recognizable household names, and if people kind of report their apps as well. This kind of like a nice narrative compliment to the who is using Svelte part of the Svelte read me. It’s on a read me, right? Or is it just the site?
[00:23:28] AJ: I saw the site on that. Yeah.
[00:23:30] KA: Yeah.
[00:23:30] SW: Oh, it’s on a site? Okay. Because like the who’s using Svelte page is just a bunch of logos. I think it’s good to have like stories of like where? So like an internal app or is it like customer-facing? We talked about in previous episodes like Disney and Square Enix, and [inaudible 00:23:50] Cloud, and Elder as well. Google used it recently for an arts – Like a crossword experiment. It’s not the main Google, but kind of like the Google apps or whatever they call it.
I think the big news that happened I think this week, actually, yesterday, was that Alaska Airlines self-reported that they’re Svelte for a pretty good use case. Alaska Airlines, it’s a pretty major airline in the US. I fly it whenever I’m on the west coast. And I was like, “Well, that’s interesting. Where do you use it?” And this is what they said. They said, “We’re using it in a new microsite we built to help guests when their flight is disrupted. The guest is often at the airport when they get the notification. So they have slow connection speeds. We chose Svelte to keep our JS payload low.
[00:24:36] AJ: I think it’s worth [inaudible 00:24:37]. One is you mentioned about the logos on the homepage. That’s actually come up in both maintainer’s meetings. It’s something we want to optimize and we haven’t got a really good idea of how to do it. There’s a notion of maybe having some sort of headline apps kind of like big sites that use it. And then everyone else kind of below or maybe deferred to another page or something like that. Maybe randomizing logos goes to so many of them. That’s something we’d gratefully receive as a PR or a least a discussion on how we could better do that, and my idea is throw it apart maybe. So if there’s someone looking for a first contribution, that’s a very good place to start.
And the other thing is about, yeah, using something in production. Is something being production-ready? A question we get a lot is when will Sapper reach version 1.0? When is Svelte version 4 coming out? The problem with this to me, and I say it every time, is that a version number doesn’t really mean anything in terms of whether something is a recent production-ready. I’ve been using Svelte since anyone even heard of it, apart from Rich and a few others, right? And I’ve pushed it to production at that point before it’s even got any traction at all. I’m not a person who follows version numbers very carefully.
But what I will say is that try and cast aside the notion of a version number or a stable or a major or anything like that. Decide what you want to do with framework X. Write lots of tests. Build prototype. Build spikes. Test it out. Asses it against other frameworks or the things you got and just kind of assert that it can fulfill in a reasonable way all the things that you want to do. And that’s only real way that you can determine whether something is production ready or not. If you’re relying on an arbitrary version number [inaudible 00:26:29] production ready or not, you’re in for a big shot. So I really disagree with the kind of tie between version numbers and readiness, or appropriateness, or fitness of purpose.
[00:26:42] KA: Wasn’t it node that had like the longest like 0. something release thing up until like just a few years ago? I don’t remember.
[00:26:54] AJ: Yeah. I mean, there’s also – It did. It certainly sort of went from 0.12 or something to 1. But there’s also a movement. I can’t remember what it’s called. But it’s something like never reach version 1.0. And it’s a group of people. Rightly or wrongly, I think [inaudible 00:27:12] is great. I’m not sure I agree with it in concept. But it’s a group of – A movement of people who want to never ever make their projects reach version 1.0. And they just encourage bumping their minor every time. And I think like it’s probably a bit tongue and cheek. But the underlying message is exactly what I’ve said is about. Don’t fixate on version numbers, because they’re meaningless. They mean different things for every person. They’re meaningless as a thing.
[00:27:39] SW: Yeah. I was also going to mention, part of the reason I try to track people using Svelte in production is because that is step one to then having jobs for people who want to use Svelte, right? That is kind of the funnel that goes towards that. There used to be [inaudible 00:27:55] called Svelte jobs on Twitter. That seems to be inactive now. I actually don’t even know who operates it. But we shouted out some major players. Recently, like Apple did some contracting work at Svelte.
[00:28:09] AJ: There’s quite a few huge names, but it’s just not everyone announces it I guess.
[00:28:13] SW: Yeah. Well, we’re not going to know everything. But I think just to create a community. I think it’s kind of like a weird cycle. Like you have to pay people to put Svelte, to care about Svelte, to put Svelte in production that feeds into people actually relying on this thing and contributing back to community, and that just kind of builds the virtuous cycle.
[00:28:35] AJ: Yeah. It’s chicken and egg.
[00:28:36] SW: It is. So, I just want to shout out that there is an opportunity this week from Open Zeppelin. We’re looking for a security platform engineer. It’s kind of like a full stack opportunity. So they do blockchain and Svelte. That’s a very interesting combination, which are very, very cutting edge. Presumably, you want to get very small JS bundles on your Etherium blockchain. I’m making this up. But, yeah, the reason we track these things in production is to build the ecosystem, and I think that’s pretty important.
[00:29:11] KA: Yeah. Okay. So we’re going to take a short break and listen to one of our sponsors.
Have you ever wondered where you can learn more about Svelte? How to actually use Svelte? You’ve probably heard about a site called Level Up Tutorials. It’s run by a guy called Scott. He makes tutorials about all sorts of things web related. And recently he’s been pretty interested in Svelte. So he’s made a Svelte tutorial and a separate tutorial, as well as I think Sapper and Meteor sort of thing. I’m not too sure. I don’t know much about Meteor, but it sounds cool. If you want to learn more about Svelte and how to use it, go to svelteradio.com/levelup and you’ll end up at the website with some nice tutorials.
[00:30:05] SW: Yeah. I think it’s like a monthly or annual subscription and it’s kind of all you could eat in terms of his videos. And there’s a lot of just frontend-y, full stack-y content. He’s a full stack developer. He’s just records very high quality videos. If you want to check a sample of his stuff out, definitely check his YouTube channel, where he posts a lot of content for free. And I think it’s a good way to level up, like I said.
[00:30:31] KA: Good way to level up. Yeah. All right. So, Svelte on MDN.
[00:30:38] SW: Yeah. I put this in there. So MDNs recent [inaudible 00:30:40]. It’s still a very important site. And I think something that people don’t really know is that MDN doesn’t just cover like – It’s not just documentation for web APIs from browser fenders. It actually is a community contributed kind of like wiki type of thing. And it covers anything. And that includes frameworks as well. And OpenSaaS. I don’t know his real name. I don’t know if he’s like anonymous or something. But yeah, open SaaS has been working really hard on the Svelte tutorial on MDN, and it’s coming along. I think it’s on part 6, but 7 chapter out of 8. And he’s even covering – Like the type support with Svelte. That’s feels old now. But it’s still pretty new. Yeah, I think he’s looking for contributors. But then you can also just now check out chapters 1 through 7 of the MDN Svelte tutorial and contributive learning.
[00:31:38] AJ: And I think that’s still in the kind of beta state? That’s still ready for final review. So if anyone’s got anyone feedback on them or input, then let OpenSaaS know, and they can be updated.
[00:31:50] SW: Yeah. OpenSaaS is pretty active in like I think the Spanish Svelte community.
[00:31:56] AJ: Yeah.
[00:31:56] SW: Yeah. That’s all I know about it.
[00:32:00] KA: It’s good that this is a thing though. I didn’t know like MDN had information or stuff on frameworks. It’s the first time I heard about it.
[00:32:11] AJ: Yeah. It’s a surprise to me too, but it’s good.
[00:32:17] SW: I think that they recently adapted Vue for the MDN site itself, and that was a mildly controversial decision. But yeah. I mean, they’re friends with frameworks.
[00:32:27] KA: Yeah. It makes sense. Okay. That was our last on topic topic, I guess. So let’s move into picks and other stuff.
[00:32:39] SW: Cool. So we’re going to picks?
[00:32:41] KA: Yeah. Let’s do that. I got to think of a pick.
[00:32:46] AJ: He’s going to find a pick really quickly.
[00:32:50] SW: Oh. Okay, I got one. I got one.
[00:32:52] KA: Go for it, Shawn.
[00:32:54] SW: Okay. So I’ve been getting into live streaming. I started a live stream with a friend of mine, Thor, from Stripe. His name is Thor, which is great. He even has like a hammer. Yeah. Yeah. It’s like the AWS and Stripe live stream. It’s every Monday at noon eastern time in the US, which is midnight our time. But the main joy that we discovered is Stream Yard. That’s I think is streamyard.com, and it’s this browser-based version of OBS. If you’ve done any live streaming, OBS is pretty ubiquitous. But I think the problem with OBS is that it’s kind of like hard to configure. Stream Yard is basically OBS with good defaults and it helps you multicast to a bunch of different popular venues. So I can broadcast across Periscope, YouTube, LinkedIn, Facebook and Twitch. But the main ones are YouTube, Twitch and –
[00:33:53] AJ: You can live stream on LinkedIn?
[00:33:58] SW: Yeah, I think so.
[00:34:01] AJ: LinkedIn stories. I mean, LinkedIn stories.
[00:34:03] SW: Yeah, you can broadcast on LinkedIn. Yeah. LinkedIn page, LinkedIn event, LinkedIn profile. It’s amazing how easy it is to hook up. It’s amazing how easy it is to organize like multiple people coming in and you got to organize their location on the screen and do screen sharing as well. All of that usually burns up a lot of CPU on my machine and it makes my machine very slow. But if you offload to Stream Yard, then it’s not that slow. It was just a very pleasant experience. I think this company is like a tool version shop in I think Norway or maybe Sweden. I don’t remember. But it’s a Nordic country. It’s just like a nice tool. Yeah, it’s free for basic usage. So, check it out.
[00:34:47] AJ: You can go and visit them, Kevin. You can go and visit them in Sweden.
[00:34:51] SW: When corona dies down.
[00:34:55] AJ: Yeah, right.
[00:34:55] KA: Unless it’s in Stockholm, then I can go, I guess. So my pick is – It’s actually a board game. Last week, I played a board game called the Gloom Haven with a couple of friends. It’s sort of like a Dungeons and Dragons style game. Super fun if you’re into co-op board games. Yeah, that’s about it. Check it out.
[00:35:21] AJ: I like good board games. So I’m going to have a look at that. Wow! It’s expensive. Whoa!
[00:35:25] KA: Yeah. But like the box weighs like 10 kilograms. It has so much stuff in it.
[00:35:31] AJ: Led must be expensive by that – Cool. Okay. So my pick is going to be actually games as well, but more online. So I don’t actually play very many online games. In fact I don’t play any games at all. But I do play with friends especially during lockdown, the Jackbox Suite of Games. If you haven’t hear of the Jackbox Suite of Games, it’s essentially a bunch of kind of multiplayer games. One of the most famous ones being Drawful, which is a lot like Pictionary. You all draw something on your phone. So you stream it via a broadcast kind of [inaudible 00:36:08] Google Meets or whatever and then you draw on your phone a picture. And then everyone has to guess what that is a picture of, and then at the end you see everyone else’s answers and you pick the one that you think is the correct answer. And they’re quite abstract topics. So it’s not easy to see what the original was, and the drawings are very bad because they’re on your phone. So it makes it a lot of fun. We spent – We stream with these games almost every week, if not twice a week. Absolutely loads of fun. My parents can play them. You don’t need to sort of be into gaming or anything to do it. And then they’ve got six party packs now. So there’re six sets of 6 to 8 games. There’s quite a lot to choose from. All sorts of trivia and quiz like that, things like that too. Essentially, it requires one person to have the games, stream their screen over a video showing service and then you can do YouTube or Twitch or whatever. And every one that wants to joins in just uses their phone. They go to the Jackbox TV website and they type in the rim code and then they’re member of the game.
You can actually go on Twitch and you can search for Jackbox and you’ll see a bunch of people playing these games all the time. If you want to kind of get a little preview before you dive in and actually buy them. But they’re really good. I really recommend it for catching up with friends whilst just stuck in your house.
[00:37:22] KA: All right. I guess that’s it. Thank you every one for listening. We’ll be back in another couple of weeks, I suppose. And yeah, take care. Bye.
[00:37:32] AJ: Cool. Thanks a lot. Bye.
[00:37:33] SW: Bye.
[END]