Why Inertia V3 Changes How You Build Laravel Apps with Pascal Baljet

Ah, so uh I'm Pascal Bette and I work on the open source team uh at Larafel and I mainly work on InertiaJS. Yes. So big Inertia news. Yeah. Um it was this morning, right? It was uh they they announced inertia v3. So I'm gonna give you the mic and I want you to tell us all about it because it's exciting. All right. So um inertia V3 uh we wanted to do three things. So um we made it smarter um simpler and also slimmer. So first we um we removed some of the dependencies. So for example um in V2 inertia always comes with exios like the HTTP client. So that's not required anymore. If you want you can still use it but uh that shaves off some kilobytes from the build size. Um it's also way simpler. So if you have your main appjs file, you have this create create inertia function and there's all your your configuration for resolving the pages, setting up your main application like the the react or view application and that's all not needed anymore. So now it's just create inertia app without any uh configuration without any object. Uh you can still you know pass in stuff if you want to but uh by default it's just create create inertia app. Uh so it's way yeah it's it's way simpler uh to get started. Uh we now have a V plugin so uh that actually powers that simplicity but it also massively improves uh SSR. So Inertia has been supporting SSR for a long time but um it was kind of hard to debug if you run into issues with with SSR. So now we support SSR in development and um it has auto configuration. So in the past you needed like your app main u your app JavaScript file and your SSR file but you now can just delete your SSR file. So SSR is rendered uh from your main app.js file um completely automatic and if you run into issues you also see them in development. So previously you had to build the SSR build and then check every page if everything works. But now if you run into an issue uh you get a nice error. Your server doesn't crash anymore. So way better experience for SSR. Um and then we have like a lot of new features actually like main features. So one of the things we uh we now have is a is a built-in HTTP client. So we replaced Axios with a built-in one and we also expose it to the to the developers itself. So in the past if you like in the past inertia all the requests inertia made were page visits. Um but sometimes you just want to make an HTTP request that's not a page visit that doesn't trigger navigation. You want maybe you just want to toggle something or check a status somewhere. So now um we have use HTTP. So we we had use form for a long time and recently we've introduced form component but now we also have use huge HTTP which is the same API as use form but it just doesn't trigger a page uh navigation. So yeah that's uh that was like longstanding uh I wouldn't say issue but a long-standing request from the community. Um uh another really cool thing that we have now is uh optimistic updates. So, for example, if you have a like button, most of the time with inertia, you click that button, it's going to make a request, and then the new props come in, it's going to refresh. And clicking a like button is mostly fast, you know, maybe just one query or two queries on the back end. Uh, but it can feel it's not instant, right? You still have to wait for that request. So, now you can um now you can do optimistic updates. So it's integrated in router in form um in link even. So what you can do now is say I want to make this request but I already want to like toggle the like thing in the props. Uh so the server always wins. So if something goes wrong we automatically roll it back. You don't have to do that manually. Um and um if other props come in from the server we we still going to override it. But for something like a like button, that's that's perfect because if you click it, you want to see instantly like a counter going up or like uh a heart going from like blank to red, something like that. Yeah, exactly. You know, um it's it's just a better experience if you don't have to wait like 100 or 200 milliseconds for that, right? Awesome. Well, um Oh, so so out of all those features, which one is your personal favorite that you like that's part of version three? Uh for me that would be the optimistic updates because that's something um that's it's easy for developers to build in but it's making a huge difference for like the end user that's that's using the app. Um another cool thing that's now built in um we call that uh instant visits. So when you click on a link in inertia, it's going to make a back end request and then when the when the JSON comes in, we're swapping the page. Uh but we with inst uh add a component to the link. You still have your href and your method. Uh but you can pass in a component with additional props. So you can already show the next page uh while the server is still loading the page. So that makes it like super smooth and super quick. That's awesome. Uh so so I I want to step back in time a little bit. So Inertia B1 was launched at I want to say it was Laron, but I'm I could be mistaken, but I was I was going to ask you sort of the origin story behind Inertia. Do you are you familiar with that? Like how it became became a thing in the beginning or anything? Yeah. So um inertia was originally like a community project from from Jonathan Jonathan Rining who now works at Tailwind. Um or it's part of Tailwinds Labs I guess. Yeah. Yeah. Um so it started off as a community project I think in 2018 2019 something. Um and I've been using it since the pre version one days. Uh so I actually use it in like production apps and of course we're also using at Larfel. So in uh Forge, cloud, nightw watch, they all use inertia. So I think V1 was probably tacked some time after that. Oh, I got you. Um but I guess when inertia team was building cloud, uh they found some things to improve. So um they made they actually made some quite big changes uh on the inside of Inertia. It was easy to upgrade from version one to version two. Uh but the whole thing was uh was sync in in version one and asynchronous in version two. So in version one if you would reload a prop and do something else you have to like wait on the first request and then it yeah it was not great. So yeah awesome. Uh so so um uh I just got the sound that we're going to have to wrap this up soon. So, uh, as the I'm going to give you the mic and let you say any parting words about Inertia and, uh, how they how the community can find you, follow you, and and basically just keep up with everything you're working on. So, I'll hand it over. So, um, the Inertia F3 beta is going to launch in, I think, two, maybe three days so that you can play around with it. Um, we have all the documentation ready and we're probably also going to launch a new demo application with a kitchen sink. Um, yeah, definitely check it out because, uh, I just mentioned three or four features, but it actually got like 10 or 12 new features. Uh, it should be easy to upgrade. It probably takes you a few few minutes. It's not like a huge rewrite on on uh on your side. Um, yeah, and if you want to follow me, I'm Pascalette on Twitter and I'm also on Blue Sky. And I mostly post about inertia. Man, I appreciate you greatly. Thank you for all you do for the community, for inertia, and for coming and and speaking to us here. So, uh we appreciate you. All right. Thank you, man.