All right, let's just go. I'm in a new Airbnb. Literally, we arrived last night late and it was a ridiculous scramble unpacking our entire lives from a van and our guests arrive in like 10. 15 minutes so i'm gonna end this as soon as somebody walks through that door um my life is very hectic right now but it is fun and i really hope i didn't just hear river because i'm trying to record a podcast what's the podcast about
Let's fix live wire. That's so funny. Our Airbnb is next to a dumpster, which is just our luck. Doesn't smell, fortunately. It's beautiful. What I'm looking at right now is gorgeous.
like there's a pool in the back the sun is shining there's hedges all around us but right above the hedges you can see a big like truck lift up a dumpster into its back you know it's like a resort type thing type place just so you don't picture us in like literally a dumpster city no it's nice it's fun it's good this is gonna be beautiful so much better than dreary freezing buffalo right now okay
um what i'm trying to do is record an episode on fixing livewire because the primogen streamed using liveware in flux for like eight hours the other day at the point he was doing it for laravel cloud but like they needed to make a little interface in their app and they used live
wire and flux so that it wasn't like a let's learn about live wire and flux it was like a let's use laravel and laravel cloud they just happen to use these tools so it's not like it you know whatever but just because they encountered these tools i got like I have notes for myself. I got a glimpse of like what newcomers would run into and that I really want to pay attention to. And there are things we need to fix.
and also the other thing is everybody's mad that volt is in the starter kits and it's not just plain liveware which is kind of perplexing to me. But the point of this is not to be mad at everybody for being mad. It's to fix these problems so that people aren't mad. But again, like we established yesterday, you can't just, the goal can't be for people not to be mad when you change.
because inevitably when you change something or when you try to move a community forward, there will be holdouts, there will be people resisting that change, it will be bloody. Think of React moving from class-based to functional. That was huge. And so many people were so mad about that for so long. And I don't know about, I don't think anybody uses class space anymore. Nobody wants to. The functional is great. Whatever.
view may be the same thing i bet people are over all the like the anger over the view composition api change whatever people are going to be mad they just are whatever but okay let's solve these problems so first off is the volt thing let's just tackle that head on i don't know i need to figure i mentioned this at the last laricon i've mentioned it on here i've mentioned it on no planets merge i mentioned this so many times but to me
it is like inevitable this is what we need to do is part of this is just more names people don't like names we talked about that yesterday they're mad that there's so many names what's live wire what's vault with blah blah blah
we need to just get rid of the con we need to basically bring volt back down to what it started out as which was like a passion project for taylor to have like a functional single file syntax close to like views composition api we should bring it back to that because some people like that i'm not a fan of the functional syntax i think the majority of liveware folks are not a fan of the functional syntax so we just stick with the class because the volt class based file is literally
it's the same it's just like you took the two files and you mushed them into one that you could copy and paste that volt class into a different file now it's a livewire class like literally just extend liveware components at a volt component public properties attributes methods computed prop the whole thing it's all of the things right there okay so
This is an easy change. What we need to do is introduce, just dissolve the name Volt for that type of thing. So now there's no more like ships with Volt. It's just like it's LiveWire. LiveWire, you can create a component in one of two modes. Single file mode.
or split file mode but it all starts with a blade component you have a blade component and at the top there's at wire it's a blade directive you can pass in the class name if you want it to be if you want the php to be in a separate class in a different file in your app namespace pass in a class name to that blade file now you're good alternatively if you want to do it in line all in one file at wire and then just write your code
and then end at wire or at end wire you know so it's just kind of like the equivalent of that php block that's in volt right now except we're just going to call it at wire this is just like um they have in swift ui and it's sensible and then people can just opt in or out as they please and then problem solved nobody in my mind will just make it so that nobody's mad about volt because it won't even be a different thing it'll just be like nobody's gonna be like
We hate that in the new starter kits, all the liveware components are in line. like they're all at wire with with the class in line instead of in a separate class like nobody's gonna maybe three people will complain about that but everybody else will just be like they won't feel the thing that right now people feel like they're going against the grain to do what they want to do
to use their separate classes. They feel like you're setting a precedent and I don't want to go against that because you're sort of, and I'm that way too. I love the happy path. So what we need to do is just make. Make their way not feel like it's violating the happy path is what we need to do, okay? Because I like the single file thing. For most components, when they get too big, I break them out. Totally. I like that.
That's the way it should be thought of. Keep them in the same file if it's simple. Break them out if it's not simple. Okay. So that's one solution that needs to be done. Period. What else needs to be done to fix this stuff? Well, I mean, that's really the big thing I think that needs to be done as a reaction to all the Twitter drama that I woke up to this morning. That's the thing that needs to change.
Now, let's talk about LiveWire more broadly. There are other things that need to change based on the Primogen stream and things I saw him get wrapped up in. So yes, the word Volt is confusing for people. I think we should stop. I think we should absorb Volt into Livewire, not make it a separate name, not make it a separate concept so that newcomers aren't confused. He was a little confused by that.
and there yeah whatever there's ways of using volt that like i'm not that into um like wrapping you know taking a normal blade file and then just wrapping part of it in at volt yeah it's a little confusing for people i think people need just like i don't know Okay. This was actually interesting. In the moment, Taylor assumed that he needed wire model debounds because otherwise it would send requests too much as you type. And that's just not the case.
wire model in livewire3 is not that way like it doesn't send any network requests you could type in every field in a form when everything is wire modeled and you will send zero network requests until the submit button is hit or whatever. And then it'll only send one network request. That was a huge, huge shift in LiveWare v3 that I needed to make to cut down on network requests and make it more just like normal JavaScript apps.
Okay, let's see what else. They added backend. Oh, they didn't. Well, they're smart. This is one that they actually knew to do. They added backend authorization inside their LiveWire methods, but newcomers don't necessarily think they need to. This is an area that you, I've tried to put documentation around this, but.
you could get tripped up where like picture you have a blade file like a liveware component of blade file and you have like at if in blade is admin and then a button that says wire click do something dangerous and then you have that do something dangerous method in your liveware component well people can actually still call that method they would just do it themselves you know and people don't always realize that but they did when they they're they're programmary enough that they were like okay
this backend code that's like dangerous is I shouldn't just rely on the template blocking it. I should also add backend authorization. I'm super glad they did that. And they thought to do that, but it did flag to me that like, these again these are like very very it's like basically the top three programmers i don't know they're like really good programmers um and and they they almost didn't do it but they did do it
So we should make this so that people don't do that. Also, there's so many like misconceptions around live wire based on the way it used to be. And that's frustrating. But whatever, just a few. mainly like that wire model thing that was a little frustrating and then also somebody in the comments was like be aware that livewire leaks all this sensitive data about your eloquent models and it's like dude that was so v2 bro we don't leak anything except the
and I think the class name. We leak whatever would already be leaked by other Laravel packages that serialize models, eloquent models. I think Echo does that. I don't know. Jobs do it, but that's in the back end. All right. Taylor thought that you had to bind values like colon value on an input as well as wire model just to get it to load like when the page loads. And that's wrong. It's just.
just wire model that's all you need but he realized that later on i don't know if somebody told him or he just like remembered whatever but yeah like and taylor is not like a full-time livewear person he's not even that much of a front-end person so some of these things are like oh yeah i mean the guy wrote blade he invented blade of course he's gonna think to write colon value equals to like seed the initial value of an input and not realize that you can just rely on wire model okay um
oh here's one about flux so prime kept being like this doesn't look good i want to make it look good let's go to flux and he would like open up flux but he didn't like find what he was looking for all the time there were some times he did but i think what he wanted
was kind of like Shad Cien's blocks, I think. He just wanted, like, I think what he wanted is a giant... I don't actually know. This is a whole other topic. But... he wanted more you know more examples where like i'm not always the best at this i sort of assume that people will remix things as they please and there are some whatever there's we need more variants i'm always like
Yeah, you know, I'm very, very careful about adding official variants. But what I would really like to do, he treats it almost like... I don't know. It's a grab bag. He wanted to go to Flux and just grab chunks of markup and paste it in. And one was like a form. He wanted to just find a form and paste it in, but that wasn't that easy for him.
And the other one was he wanted like a call out. We don't even have a call out component. So we need to have that. And he wanted like a card variant. And so he went to cards, whatever. He's just doing what people do, which is like, think about what you want.
look at the navigation, find the closest thing to what you're looking for, and just scroll around and look at the examples until you find something that looks like what you want, and then you copy and paste it and then rework it. So I need to cater to that experience more than I do right now. um okay let's keep going um yeah prime got tripped up because he needed to add a an exclamation point on bg red 200 so he wanted to like override the background of a card and he used it it wasn't working
He was just adding BG Red 200 and it wasn't working. And I just went in the chat and was like, you need to add an exclamation point because it needs to take precedence over the default card background. And so some of... Basically, you can solve this in one swoop by having an intelligent Tailwind Merge type situation. Like, they have in React. It's called Tailwind Merge, I think. And I think Shad Sien uses it. It's basically like...
If a class is passed in, something intelligent will go, oh, there's a new BG-class being passed in. Let's override the last one. Or let's override the existing one on there and let this one. you know just exist the problem the there is one of these for php and i just have never i never even entertained using it because i can't imagine like there's already performance issues with blade components i can't imagine
If everywhere we ever use a class, we loop through an array, we like take a string, split it out into an array and loop through every item and regex every single item. Like there's no way that's performant. you know? So alas, there are some hacks around this. It would be nice to have a better story for it is what I'm saying. I don't know what the answer is. It would be great if there was like a compile time.
tail end emerge and maybe there is and maybe that's this is this is a problem we should solve yeah yeah we should yes okay it's easy to get like caught up in being opinionated like You could hold like, well, all right. Shout out to Adam Wathen for being opinionated. He is strongly opinionated and it has worked very well for him because his opinions are very good.
but here's a bad opinion no i'm just kidding but i i went to him with this like problem and he's like we literally never need the exclamation point i think i gotta go i think people are entering my house well Let's call this a part one, all right? This is Fixing Livewire part one. We'll do part two whenever I get another moment of silence. I'll be seeing you.