Nitro, Vinxi, and RSCs - What's Good with Dev Agrawal

Dev and Joel discuss React Miami conference, praising its fun atmosphere and location. They chat about React Server Components, with Dev sharing his experience building a mini framework. They talk about Vinxi, Nitro, and the unjs ecosystem as tools for creating custom frameworks. The conversation touches on Vue's popularity outside web dev circles and non-web dev conferences. They discuss the benefits of TypeScript and strongly-typed APIs. Dev mentions his upcoming talk on durable objects at a conference in Dallas. They end by discussing WebSockets, PartyKit, and platform-specific frameworks.

What's Good?

Share with a coworker

Transcript

[00:00] Hey, Dev. Hey, Joel. How's it going? So we're going to talk about what's good. And you're wearing the shirt, so we can just kick that off.

[00:11] Why is React Miami good and what did you enjoy? It feels like it's becoming more than just a React conference where there's this set of developers that don't even care about, maybe even hate React, and they're still going to show up to React Miami. Why? Yeah, because it's a conference in Miami. It has some of the most awesome people and some of the most awesome parties.

[00:37] Is that the draw? I mean I saw it on Twitter too. It looked great. I bought a ticket already. They have their super early bird sale going.

[00:44] So I figured I'd just go ahead and at least commit to buying a ticket. Sometimes I'll do that and still not show up. But like, it's one of those where I felt like last year I was really missing out. Yeah, it's just like a really fun event. And it happens to be like at a really fun location.

[01:02] It could be about anything really, and it would probably still be an amazing conference, but the crowd that React gathers, the community is pretty nice. I probably have a more special place for it because it was my very first web dev conference that I went to. Like two years ago then? Yeah, three years ago, so 2022 was the first one. It kind of has a special spot for me.

[01:35] But other than that, I think it's just like the organizers put in a lot of effort to just make it a really fun conference and really fun experience for everyone. And Twitter keeps hyping it up for that reason. Any other ones coming up, conferences that you're? Any other ones? Yeah, there's CodeMash, which happens in January.

[01:58] I spoke at CodeMash this year. I'm hoping to get accepted again. They do it at an indoor water park in Ohio. It's pretty fun. Yeah, that is cool.

[02:08] Yeah. Yeah, so something with a twist, like the location's important too, I guess. Yeah. I mean, other than that. Not just standing around in a conference hall and bashing the technologies that you don't like or whatever, that's fun.

[02:19] So you gotta have something besides that to really bring it together. Is React still good? I mean, that you'll get at every conference. React is still very good and it's getting better. Yeah, I'm like, I'm on the bleeding edge, I would say.

[02:35] I had to stop using Canary because of the, like the, whenever they switched, so all the downstream stuff, all the libraries, like Framer and whatever. So I had to stop. Like I was on Canary for a long time and I was kind of sad because using Next, if I'm not on Canary, I can't use like their partial pre-rendering and that kind of fun stuff. But it's like a, it's interesting to me because I feel like it's a whole different paradigm from what I'm used to with React. And you have to kind of think about applications way different in the React server components world than in the old kind of server side rendered where you run a node and it's just basically faking a browser.

[03:16] It's like a totally different different mindset for me. Yeah. Yeah, it's been very fun trying to get a hang of server components. I think I've done like the pendulum swing from Not liking it to liking it and now I think I'm slowly speaking back to a little bit towards Like not it's like it's the Gartner hype cycle, right? I can go up the peak of inflated expectations and now I'm slowly coming down the What is it I forgot what's called Valley of despair trough trough of despair trough of despair.

[03:53] Yes Yeah, that's the I spend time in there. It's nice when you're on that high high though, like when you're really riding that top of that peak, like in you're getting it going. So, but I mean, you, I think you've taken React server components probably further than most of us, right? Like, cause you were actually trying to do some implementation work and playing with it. Yeah, I tried to build a mini framework with it.

[04:16] That's fun. Is that madness? Like, why would you do that? I don't know. Like we wake up and be like, yeah, you know what we need?

[04:27] Other framework. Yeah. I mean, I felt, I mean, I've known kind of since the beginning that it's a very new and innovative idea. And React tends to do that often, like hooks and even like the very first time it came up with the idea of VDOM. Like, these are kind of like things that no one else has really messed with.

[04:51] It's like a paradigm shift. And thought about. Yeah. Like shifting the industry in a different direction. Yeah, exactly.

[04:58] And the thing with server components is that for the longest time, the only way you could use them, you could play with them is Next.js. And it's like a really nice thing that comes wrapped into the opinions of Next.js and it makes it really hard to see what's actually the paradigm shift in there. Because you never know at any point if you're dealing with the Next.js weirdness thing or a server component thing. So I kind of wanted to just like get rid of all the layers and play with the thing underneath. Obviously React made it really hard because they are working directly with Next.js and they don't have nice ways to support it outside, but the Vite ecosystem is doing great work there.

[05:41] So I was just standing on their shoulders there and trying to play with it myself. Because there's not a spec. It's not like some, like GraphQL, I can go read a spec where there's, you know, that exists where we have that, but there's no spec in terms of, like, how do you know how server components work? Like, where do you even start when you sit down? Like, if I was going to start and I was like, oh, I do think it's a good idea to build my own mini framework.

[06:06] And I think that, you know, like, I know you're not trying to build like the hot new framework you're just exploring, that's how I took it. But like, how do you even start? Like, if I wanted to sit down and, you know, start tinkering with server components at that level, what's the starting point at this point? Yeah, great question. There's actually a pretty good blog post on this by one of my friends, Brendley Duck.

[06:35] He has been like helping out, helping around with the Solid community. He has been involved with Vinxi as well, which I give a talk about at React Rally. And he has this post called Simple RSC with Vinxi. I'm going to put it in the chat here, and maybe we can put it in the show notes or something, descriptions. Yeah, he gives a really nice breakdown of what it would take to implement a very minimal server component framework using Vinxi.

[07:11] And it's a really nice fit because Vinxi, which is kind of a build server tool for JavaScript frameworks. It was kind of born out of this exact same need that I described, which is that I want to play with server components, but I don't want to use Next.js. I want to explore the underneath paradigm without the frameworks opinions, which is exactly what gave birth to Vinxi, which is now being used to implement meta frameworks. So the first time I ever heard about Vinxi was your talk at React Rally. And I'm surprised, how long has it been around?

[07:52] Like it's fairly new, like is it a couple years or what's the, how long is this tool? It's, Yeah, probably like a little over a year, but Because of the history behind like how it came to be and what the author has been working on it like it The author of Vinxi like he kind of has a story of or like kind of a history of trying to build frameworks or like meta frameworks or meta meta frameworks. Meta meta frameworks, that's what this is really. Yeah, he pretty much yeah yeah he gave a VCon talk last year about it of like how many different frameworks he's tried to build over the last few years and what he's learned from it. It's relatively recent.

[08:42] But the things that it's built on top of, Vita and Nitro, obviously they've been around forever. Davey – Has Nitro been around forever? Because I swear that was the first time you're bringing me all the new stuff. Like you were talking about Nitro because we were talking about using something, I think it was around WebSockets and you're like, I'll just use Nitro. And like, I'd never heard of that.

[09:01] And I'm honestly a little bit tunnel vision. I just use Next and deployed a Vercell like a pedestrian. But. But you do know Nuxt, right? I do, yeah.

[09:12] So I've heard of Nuxt and it's like Next for view, right? Is that a fair way to describe that? And then so Vite based, I'm assuming, and all that good stuff is part of the mix. Yeah. Yeah, and in a sense, Nitro has been around for exactly as long as Nuxt has been around for, because Nitro is essentially the server that, all the server features of Nuxt, which at some point it was taken out of Nuxt and like they started maintaining it as an independent piece so that it can be used in places other than Nuxt or it can be used on its own.

[09:48] So it's literally like all the server features that a meta framework like Nuxt or Next would have, but it's been published as a separate package. They keep doing this, they're going to have a really hard time maintaining their moat to collect venture capital I think like if they keep like breaking it down and giving people tools to just build their own stuff like that's how is That good for business? Yeah They've been doing that for a while. I mean the whole unjs community the Unified I think that nothing that's unified is unified as unified. I've seen around markdown and and like the Is unjust associated with them?

[10:26] Yeah, no, I unjust is its own thing It's basically unjust is like taking the Nitro philosophy and applying it to basically every little piece of functionality that you could think of when it comes to server stuff or bundling anything JavaScript related. I describe it, the unjs philosophy as a robust ecosystem driven by the Unix philosophy, housing purpose-built high-quality JavaScript utilities, libraries, and tools upheld by a collaborative community. And then we're like literally seeing really amazing tools come out of this, right? Like at the end of the day. Nitro, I looked at it and I was, you know, like I came away and you're excited about it so I was like I'm going to check this out.

[11:10] And really it's just like the, like it gives you just the building blocks to start building something. And I think it is interesting because a lot of times something like Next is opinionated and it does its thing. And Remix is also to some extent, but like a framework is somebody's opinions like kind of codified into a thing. And a lot of times when you're working on an actual project, like those opinions don't match with the needs of the business. So this sort of like, hey, you could, you get the shape of this thing that you want and you get to, you don't have to build a router or whatever, right?

[11:43] Like you can use this. I think that's powerful. I think that's really interesting in terms of, and portable too, because if I work with Nitro and hop into Next, I'm gonna understand how these things work better, I feel like, at the end of the day. Yeah. Yeah, and the primary goal of NGS is to cater to Nuxt and then to cater to the rest of the community, which means that a lot of those tools are always going to have a very high quality bar or very high portability because first and foremost, they want Nuxt.js to work everywhere and they want Nuxt.js to be very nice to use.

[12:24] Like it's, it's the one framework. It, yeah, it's the one framework that always gets left out in these discussions. Whenever we talk about like Nuxt.js, we make Svelte, we immediately, we immediately jump to like SvelteKit. Yeah. Yeah.

[12:36] Ember is another one. But like Vue and Nuxt are some of those which like they have a really high adoption, especially like by big enterprises. Like When I go to these non-webdev conferences, everyone's always talking about how much nicer Vue is and how much everyone's just using Vue over React and how to switch from React to Vue. Like that's what I keep hearing about at non-webdev. I gotta get out of my bubble.

[13:01] Yeah. Yeah, it's really nice to sometimes get out of the bubble. What's a good non-web dev conference then? Where are you going? What's an example of that?

[13:14] One that I'm an organizer for in Cincinnati is called Momentum Developer Conference. It's not web dev focused. The other one that I mentioned earlier, Codemash. There's something beyond the web, is what you're telling me. Exactly, yeah.

[13:30] There's people still writing Java and C Sharp, unfortunately. That's wild to me. Yeah, Codemash is another one, I brought it up earlier. KCDC is the one that I look forward to. It's the Kansas City Developer Conference.

[13:45] It's like enormous. It's probably one of the biggest that I've been to. That really speaks to it. What you're talking about is like Java or C sharp developers, but they want the same good stuff. And if you're a Java or C Sharp developer, something like Next.js just isn't, that isn't what you're looking for, right?

[14:07] Like you need something that's, one, I don't know about Nuxt, I haven't used it. It sounds like I'm missing out. But they're helping me because they're taking all of the good stuff and applying it in these low-level tools that would let me then, like if I'm building a Java app and I want a really nice kind of modern JS front end, that seems like a good way to think about it maybe. Yeah, pretty much. Imagine if Next.js did that.

[14:36] Like broke out all the cool stuff that they built, like at Vercel, like it broke it out like this to where we could just take the building blocks of all the things that make Next.js awesome, because it is, it's like good, right? But if it was broken apart where we could actually then take those little Lego pieces and construct new things on top of it, that would be sick. Yeah, yeah, but they're kind of like really trying to operate on the opposite philosophy of, let's put everything together and let's have control over every single thing. They understand it. Right now, I'm like hiring the React team members.

[15:07] Yeah. You know what I'm saying? They really get it. At a business level, it's really impressive. I wish them success and appreciate the tools.

[15:15] But on the other hand, I think this is awesome. And then it's like, we get, you know, with Egghead and these other things, and it's like, people want to learn Next.js, and I'm like, I think that's great, and you should, but then we get oversaturated because that is the most popular thing. And like, part of my idea for this conversation was like, what, you know, if people are going to learn and you want to sit down and actually learn what's going on, you want to learn React server components, next is fine. But, you know, taking Vinxi and Nitro and building yourself a tiny React server component framework that you can like toy with and break and poke at, like to me, it sounds like an amazing, like you did that, right? Like you've done that and through that experience, do you think it like helped you as a developer or helped your understanding of like where we're at right now in terms of the ecosystem or what did you get out of that experience, I guess?

[16:09] Yeah, I mean, one of the biggest things was just learning how routers work or like more importantly, the role of like routers in modern applications Because server components are these things that really are meant to be consumed by a router and a bundler. It's part of the puzzle. Yeah. Exactly. The whole point of server components is that you can render things on the server, but still have a client router, which was kind of the key innovation.

[16:39] So it was also like my first time just building a router, which was fun. Just like learning about how these different pieces fit together, like how you can have bundling and routing and server rendering work together, because right now they're all kind of separate things. Like you have a single page app without any server rendering, it has routing and bundling, but it doesn't have server rendering. Or you can have apps that have server rendering and like bundling, but they don't have a router inbuilt like solid start. So like there's all these different things that you can do with the framework, but then server components are something that requires all three of them to be working together.

[17:21] Otherwise you don't really get server components. Did you say Solid Start doesn't have a router? It doesn't. So it's one of the reasons why they call it the shape of frameworks to come, because they try to really find the line where Solid Start can just be a starter template, which is hence the start, that you can use it for any solid applications. It's not like Next.js where you can use, you would want to use React outside of Next.js, right?

[17:54] But you shouldn't really need to use solid outside of Solid Start. It's a starter template that works in every scenario. And then you bring in whatever router you want that fits your use case. There's another one I feel like I've been sleeping on, like solid, like it's just, I don't know. And then, you know, like when I go look at Nitro and these other tools, like I see Ryan Carniato as a committer and contributing to these things.

[18:20] And it's the, they all, it's because you got TanStack Start coming up and it's using these tools. You have Solid Start that's using these tools. What are the others? Is there any other? Because they seem to be using start as the meta framework naming scheme.

[18:38] There's something going on in terms of how people are building these things, I feel like. Yeah, there's a conspiracy going on. We have to uncover it. A conspiracy of hard work and free tools. Yeah, yeah.

[18:52] Yeah, Brandon Roberts recently decided to take Vinxi for a go and built a mini Angular framework called Angular Start. Angular Start, like what's going on? That's wild. And I think that the start just comes from a solid start, which was supposed to be like a starter template, like not a full blown framework like Next.js, but something more, a little more minimal, but still gives you all the capabilities of like server rendering, server functions, things like that. And again, the idea is that you use it as a starter template for any solid app.

[19:26] And I think when Tanner started his framework, he just like, I think he just liked the name, Start, and he picked that up. It has the router and stuff all built in, so it's a little more all-encompassing, I think. But it's using the same underlying, is it using Nitro and Vinxi, I think, under the hood? So philosophically, it's aligned with solid start in that way anyway. Yeah, but in the routing sense, it's very much a framework for TanStack Router instead of being a completely router agnostic.

[20:00] Have you used TanStack router? A little bit, yeah. It's kind of a surreal experience. It's like every time, it's like the first time I used TRPC. Like every time you go from not type safe to having like a fully type safe experience of something.

[20:17] It's like a- PRPC blew my mind. Like going from like writing raw API routes that just, you know, send your HTTP request and get back whatever you get back to like a fully typed experiences. Like I agree, like it's, it'll peel back your face. It's awesome, actually. Yeah, it's very much a similar feeling once you go to Tanstack router I haven't used it enough I'll be honest But even just like the little bit that I used on trying to build a toy project, it gave me that same feeling.

[20:51] That's cool. And I mean, I guess I end up, I don't know. Now I want everything typed and use the Autumn for all my requests. And like, I want, you know, it's like that idea that your boundaries should give you nice strong types is really pretty powerful. Makes, I mean, I love it.

[21:10] It's like refactoring the error pop-ups. No telling how many times I've had TypeScript fail because of my just trying to, I'll just change that up and then it fails and saves me, that's great. Well, what else is good? You got anything that you're excited about right now? Yeah, I mean, playing around with WebSockets is really fun.

[21:39] I just got accepted at a conference in December that's happening in Dallas. Do you know Danny Thompson? I'm going to be there actually. On Twitter? Oh yeah, you're going to be there.

[21:49] Perfect. Yeah, I sent him a DM or I replied to him on Twitter saying that, hey, are there any spots to speak? He sent me a sessionized link. I submitted a few of the proposals that I submit to a bunch of conferences and like five minutes later he DMs me and says, hey this talk sounds fun, you're accepted. I think it's great and Danny does so much with the community and then he's taking all of the profits from the conference and actually donating it to charity which I thought was really really cool as well So it should be a good event.

[22:22] And it's web dev, but also non-web dev. There's three tracks, so there'll be like a mix of folks there, and that should be fun too. Yeah, the one I got accepted was for a cloud track. It's on durable objects. Oh nice.

[22:37] Yeah, that's a good one. Like that's another thing, like durable objects. I feel like we could probably have a whole chat about what's going on with them because I feel like it's a it's another one it's like one of these like building block pieces and I think Cloudflare is doing a really good job about giving us primitives to do interesting stuff with so yeah yeah I'm gonna be picking Sunil Pai's brain about it tomorrow. Oh fun. Yeah, he's always fun to hang out with.

[23:04] He's got some wild ideas going on. It's gonna be cool to see what he comes up with next. Yeah, it was really fun to see him being at Cloudflare, then leaving Cloudflare to do his own thing, and then Cloudflare hiring him back for the things. Hey, no, okay, we get what you're doing now, come back. Yeah, it is like, I'm, and you know, he seems stoked to be back and doing the thing.

[23:26] And I like PartyKit finally, WebSockets to me have been, What would I say? OneNext doesn't provide them out of the box, so that makes it more difficult for me in my way that I approach these things. But then it's just like, they've always been such a hassle and it feels like every time I've ever tried to use them in the past, it was just a huge pain. And like, PartyKit was the first time I was like, tick, tick, tick, tick, and then, shh, and all of a sudden, I just have sockets communicating. Pretty much.

[23:55] And it's another one of those things where once you have that in your system, you really wanna, you know, it's like, this needs to be here, this was always meant to be, so. Yeah, And I feel like that could be like a missing piece to something that the JS ecosystem just didn't have any possibility of like having so far, which is LiveView. Like LiveView is a really interesting project that like depends so much on the special Erlang virtual machine that it runs on. But I think what DurableObjects give us is something very similar. Like it is with vendor lock-in though, like it's, it only works on Cloudflare where our lang just runs everywhere, but it gives us that similar kind of underlying platform that we can use to build something like LiveView, which I'm very much excited about.

[24:50] And my exploration- What do you think about platforms? Like platform specific frameworks and meta frameworks though? They are, yeah. I get why they want them as the people delivering, selling the picks to all of us miners, like that's something that they want. And I think they have their place And definitely serve a purpose, but at the same time, it's a little frustrating.

[25:18] It can't be. Yeah, I mean, it's always going to be a trade-off going for vendor lock-in, right? You have to be really careful about which vendors you lock yourself into. And trying to be free of all vendor lock-in is a nice concept in theory. But like when it like practically like there's a lot of weird things that come around with it.

[25:48] Like you always lose something when you go vendor free. Yeah, for sure. Like they do a lot of work. It's like, I don't know, like we'd have to staff up so much to, and I use Vercel as an example, where they provide us with such, you know, like a ease of light. We just get to, we get to like eliminate a whole swath of problems and focus on a different set of problems when we do that.

[26:13] But at the same time, now we're kind of, you know, like you're, how deep do you take that? And then also removing optionality or your ability to migrate from, it's like, that's always something to think about too. I spent years trying to get off of Heroku and finally succeeded this year. So actually last month. So we got all of our- Last month.

[26:37] It took a long time. And it was mostly because I would look at it and be like, I really need to move and then not do it. But we went to flight control and our Bill went from thousands of dollars to hundreds of dollars. And like, that's great. So now that app was like, I don't, it would make me mad because I'd be thinking about how much I'm spending on this app every month.

[26:58] And then now I don't hate the app as much as I did previously. So good for it. Yeah, Brandon's doing some really cool stuff with flight control. Excited to see what he does. Yeah, it's really neat.

[27:11] And you know, like AWS, I like a lot also, but it's just hard to use. So like SST and flight control and tools that are abstracting and putting a little layer on top of that, but still letting you like use AWS more directly. That's pretty cool too. Yeah, for sure. I just, I don't think they have a serverless option yet.

[27:31] Do they? Like they're still operating on containers? Flight control? I'm pretty sure. I didn't ask much questions.

[27:38] They actually did the migration for me and it just works. Okay, cool. But it's definitely, like it's Docker under the hood, I'm pretty sure. Right, yeah. Versus like an SST, would that be the alternative?

[27:55] Yeah, I guess SST used to be very serverless focused. I think they kind of still are, but because of their new, like I guess rebase on top of Pulumi, they can do pretty much anything. Which is like the coffee shop that they're running now, it's running on top of like containers. They're not using like anything serverless. They're maintaining OpenNext, which is one of the most like wacky things I could ever imagine to undertake.

[28:25] Like, wow. Yeah. Actually, funnily enough, like it's the SST core authors, they don't directly do a lot on OpenNext. It's mostly a community of people who just really like Next.js and want to deploy it on their own who work who built like the OpenNext. I wouldn't describe their messaging as really liking Next.js actually.

[28:50] Like the SST folks. Yeah, for sure. They have a different sort of town when they're talking about that tool. Yeah. Hey, but they were at ReactConf, not ReactConf, React Miami.

[29:05] Yeah, and we'll be next year too. Dax will be in the house. Well, cool. It was great catching up, and I think, I mean, I've got a lot to think about, so yeah. We'll pick this up next time.