Introducing Boost Skill0:00
Okay, everything in the series so far has been manual using our own brains, and I think it's very important actually to understand these things yourself, even in the age of AI. But we are in the age of AI. So Blaze does have a boost skill that you can use to automatically do most of this. It may get a few things wrong, and that's why you're armed with human knowledge , but
Installing Laravel Boost0:24
It may get a few things wrong, and that's why you're armed with human knowledge , but it's going to be helpful. So let's check it out. First we need Laravel Boost in our application. I'm guessing you have it in your Laravel app already, but if you don't, let's install it. Composer, require Laravel Boost, and then when that's done, I want to run Art isan Boost
Composer, require Laravel Boost, and then when that's done, I want to run Art isan Boost Install, and it'll give us some options, and maybe we'll just kind of skip, we 'll be scrubbing a lot in this video because I don't want you to wait for this stuff with me. Okay, so here it says, "Which third-party AI guidelines would you like to install?" And it automatically picked up that we have a Blaze skill that we already offer , and it knew that.
, and it knew that. So we hit the spacebar to make sure that that's checked and continue on, and what I like to know, I'm good. Okay, that's fine. Okay, so now we have Boost All installed, and I personally use Cloud Code, but anything you use should be able to pick it up with MCP servers and skills and stuff like that.
Verifying Skills in IDE1:21
you use should be able to pick it up with MCP servers and skills and stuff like that. But let's verify. I'm going to open up Cloud, and inside Cloud, I can type skills, and it should show me everything available, and there it is, Blaze Optimize. You could also type like MCP to see, you know, what's installed, Laravel Boost MCP is installed, so you need that. So we have, we're good.
Running AI Optimization1:40
so you need that. So we have, we're good. Cloud is recognizing the Boost stuff. We should be good to go. Now, let's just run it. This app has no Blaze added to it. You saw on the page right here that it's slow, 750 milliseconds. So I'm curious, can we use AI to do everything for us? Let's try it. So the prompt that I'm going to use, I'm just going to say activate Blaze.
Let's try it. So the prompt that I'm going to use, I'm just going to say activate Blaze. You could say Opti, I don't know, what do we say Optimize, Optimize this Lara vel app with Blaze. Okay, and then just hit Enter, and it's going to do some thinking. Okay, so it's asking me if it can make this edit to the service provider, it is going to optimize the entire views components directory. This is great, that's the decision that we clearly made, and it did it because
to optimize the entire views components directory. This is great, that's the decision that we clearly made, and it did it because it reasoned about it and said, all clear, no incompatibilities, now let me enable Blaze compilation and set debug mode. So it's putting debug mode on, and it is enabling compilation and adding the optimization for that whole directory. So, so far, so good.
for that whole directory. So, so far, so good. Let's keep going. Okay, now it wants to add Blaze debug true to the env file, presumably so that it can read its own debug statements, which would be pretty cool. So let's say yes, let's do it. Okay, so it did what it could. It said here's a summary, Blaze is installed, compilation is enabled, Flux is detected,
It said here's a summary, Blaze is installed, compilation is enabled, Flux is detected, no incompatible components found, debug set true, that's pretty cool, let's reload the page and see what worked. Okay, so that's, that's really gratifying, you install Blaze and you use AI to just go optimize your app and it just made it twice as fast, which is pretty awesome, great. So now it says want to go further.
Choosing Trace-Based Optimization3:24
great. So now it says want to go further. Option one, trace based optimization, browse your app with debug mode enabled, and then base, I'll summarize this for you, it's basically saying you browse your app with debug mode enabled and all of those files that it uses to show the profiler, it's just going to inspect those itself and learn some things about your, your app and optimize heavy components.
those itself and learn some things about your, your app and optimize heavy components. Or option two is skip that and actually just go through the whole code base and audit every file, you know, file by file and see what things need to be folded or memoized or whatever. This is no good because this is going to cost that warning significantly more token intensive results are speculative and incorrect optimizations can break components requires thorough testing.
results are speculative and incorrect optimizations can break components requires thorough testing. So this is not the one we want to do. Fortunately, we have debug mode, we have the profiler. I think this is so clever that, and it sounds like I'm tooting my own horn, Philippe Phillip Gagnitz. He did all of this. He works with me at live wire headquarters. He did a lot of work on blaze, a lot of, a lot of the compiler, a lot of things
He works with me at live wire headquarters. He did a lot of work on blaze, a lot of, a lot of the compiler, a lot of things , the profiler, all that is him. This skill is actually him as well. So I'm tuning his horn, not my horn, but this is really clever that you just manually browse your application, all that debug information gets collected, and then this AI is going to use that to be intelligent and not just burn through a bunch of tokens.
this AI is going to use that to be intelligent and not just burn through a bunch of tokens. So this is really cool. So I think all we need to do it says reply one or two when ready. So let's say one, and then it should prompt us to go and explore our application with debug mode enabled. So let's see what it's going to do. Go ahead and browse your app, make sure to visit the slow component heavy pages , and then
Go ahead and browse your app, make sure to visit the slow component heavy pages , and then tell me when you're done. Okay. So this is all I need to do. I'm just going to load this single page because this exercises all of our components. We have all these components right here. Okay. So we should be able to just say, I'm good.
Reviewing AI-Suggested Changes5:08
Okay. So we should be able to just say, I'm good. Go for it. Okay. And we do it. Go. Okay. So that took a while. It is asking, I mean, a while, three minutes. It is asking if we want to add memo true to online count, which is pretty sweet
It is asking, I mean, a while, three minutes. It is asking if we want to add memo true to online count, which is pretty sweet . I think maybe it's been influenced the last time I ran this right before this episode when I tried to, tried to record this episode the first time, it didn't catch this. And so I was going to say, see, this is why we need to, you know, watch a series like this and understand it deeply so that we can catch things like this when this
series like this and understand it deeply so that we can catch things like this when this should be memo true. And it was like, Oh, it shouldn't be memo true because there's a database query in it. But right now, this is AI for you. It's saying we should add this and I'm saying, yeah, we should. And it's going to add memo true to separator. Okay.
And it's going to add memo true to separator. Okay. So now it's just going through and it's asking me everyone. So I'm saying text, full true, sure. Yeah, full true, full true. I don't know. I'm not checking its work. It's using safe. It knows like what things could be passed through heading. Okay.
It knows like what things could be passed through heading. Okay. So that stuff seems okay. Did it sneak option in there? Because option was a really expensive one. Okay. So now it says, now the option refactor converting slot to label prop for memo ization. I don't like this one. It wants, it wants to convert slot to label so that when you're using it,
I don't like this one. It wants, it wants to convert slot to label so that when you're using it, because remember memoization doesn't support slots, instead of using a slot, it's going to use a label prop. And then that way it can be memoized, but I would rather it not do that. I would rather it fold it. I don't know why it can't be folded. So let's say no, can we fold this instead?
I don't know why it can't be folded. So let's say no, can we fold this instead? We'll see what it says. So okay, we did find one thing that it got wrong. So we're not out of jobs yet until this episode works without us intervening. Sure. All the option values are static strings. So folding the work right here. I don't know why I didn't reach for that in the first place. It did the last time I ran it.
I don't know why I didn't reach for that in the first place. It did the last time I ran it. So this is how AI is. Sometimes it does one thing. Sometimes it does the other thing. You want to make this edit to option blade. Yes. I do. I also want value to be passed through. It didn't, it didn't catch that.
I also want value to be passed through. It didn't, it didn't catch that. It didn't make value pass through. So I don't know if that's going to work. It's going to work for this, for this page, but okay, refresh the context page and I'll come back and I'll compare the new trace against the old one. All right. Let's try it. So refresh.
Let's try it. So refresh. Whew. Ha ha. Pretty sweet. Love to see it. It missed a few things like the option value should be a safe property. Okay. So I'll say okay, compare and let's see what it does. Okay.
So I'll say okay, compare and let's see what it does. Okay. So it compared the new results. It said biggest wins online count option and it shows a bunch of other ones. The online count memo was the single biggest win one DB query instead of 250 perfect in that case we got away with using memo. I think there's other scenarios where maybe that would have been the wrong move . Hopefully AI would have caught that it didn't, it did catch folding option, but
. Hopefully AI would have caught that it didn't, it did catch folding option, but it didn't catch that the value prop should be safe pass through, but I'd say it did pretty good. We just kind of sicked it on our code base and it did its thing. So this is great because this handles a lot of the heavy lifting so that you don't have to painstakingly go through and figure everything out yourself. But it will make mistakes and those will be kind of costly mistakes cognitively
to painstakingly go through and figure everything out yourself. But it will make mistakes and those will be kind of costly mistakes cognitively costly because you might not catch them right away. And when they do crop up, they might be sneaky like something's folded that it shouldn't. And I don't know, a navigation item in a sidebar is never showing that it's the current item. You know, you go, how come that's not working? Something's broken about my app, but Blaze just folded it when it shouldn't
You know, you go, how come that's not working? Something's broken about my app, but Blaze just folded it when it shouldn't ever something. So you need to combine your brain and this. And I think that's that's pretty good. We got, we got it way optimized just with AI. So that's great. I hope you like Blaze, Blaze is necessary to me for every Laravel application of any amount of like meaningful size, Blaze fixes the slowness in blade components
of any amount of like meaningful size, Blaze fixes the slowness in blade components and makes it a dream. There are obviously some ins and outs. We have AI, you have this series or just use flux for everything. And then, you know, you don't have to think about this stuff as much. Shout out to Phillip. Like I just said before, he did so much work on Blaze. He did the landing page.
Like I just said before, he did so much work on Blaze. He did the landing page. He did the functional compiler. He basically rewrote it. He's done so much. He did the profiler. He did the boost skill. So a lot of this is his work. It was my work initially and then he kind of took it the rest of the way. So good work, Phillip.
It was my work initially and then he kind of took it the rest of the way. So good work, Phillip. And that's Blaze. I hope you enjoy it. I hope you enjoyed the series. I hope if nothing more, you learned a little bit more about how blade works and that will help you as a Laravel developer. So I'll be seeing you.
So I'll be seeing you.
