تماشای این درس نیاز به اشتراک حرفه‌ای دارد.

When Not to Use0:00

(upbeat music) Okay, I've given you a lot of reasons to use Blaze but I haven't talked about when you shouldn't use Blaze because there are times where you should not write at Blaze on a component. There are certain features that it's just not compatible with by design. We've chosen to not make it compatible so that we can keep Blaze slim and really fast. So we skip some features that we think most people don't need

Class-Based Component Limitation0:21

so that we can keep Blaze slim and really fast. So we skip some features that we think most people don't need so why waste runtime on them? Let's make Blaze as fast as possible, okay? The first and biggest one and probably the only one that matters for most people is class-based components. If you use class-based components, Blaze will not optimize those. And what I mean by class-based is if you say like PHP, Artisan, Make, Component, BaaS or something,

And what I mean by class-based is if you say like PHP, Artisan, Make, Component, BaaS or something, it's gonna create two files by default, a class and a blade view. That's a class-based component. That's kind of old school at this point. Most people that I'm aware of use anonymous components. I use anonymous components exclusively. This is when you use like app props. It's basically everything we've been referencing so far.

View Share Incompatibility1:01

This is when you use like app props. It's basically everything we've been referencing so far. I haven't even mentioned class-based components. But if you do use them, Blaze doesn't support them, okay? Now there's a bunch of other things in here that I think most people don't use but I think it's worth mentioning so let's just briefly touch on them. If you use view share like this, view share from your service provider

If you use view share like this, view share from your service provider and you say like message, hello world. So you would typically do this with something like a brand, you know, or like an app name or something. So like a brand is like Hello Kitty. So if we were to echo this, you will notice that, whoops, that it fails. It says undefined variable kitty, hi tight kitty. What is wrong with me?

It says undefined variable kitty, hi tight kitty. What is wrong with me? Undefined variable brand. If we remove Blaze and then we try that again, well, let's clear the view cache. Okay, it does work. So Hello Kitty works normally but as soon as you add Blaze, it doesn't work. There is one workaround for it. You can access the global underscore underscore ENV

There is one workaround for it. You can access the global underscore underscore ENV then shared and type in brand like this or kitty whichever you prefer. And you'll see that we are back. Nope, I didn't add Blaze. Add Blaze, clear cache, reload, it works. Okay, so if you do need to use view share, that's a workaround for you. We skip it because we're trying to make Blaze fast

Aware Prop Boundary Issue2:21

that's a workaround for you. We skip it because we're trying to make Blaze fast and we don't really use that that often. The only other thing that is barely worth mentioning is if you have like multiple buttons and you put them inside something like X button group and then you have like, let's split this up and then we'll get button group. Okay, so you have like a button group component. That's a div with a slot.

Okay, so you have like a button group component. That's a div with a slot. And then you have this nested, you know, child this button. And then let's say in the button, you have like a prop. So let's say you were to do like size. I wanna make this button sizable. So we make it medium like that. And then let's just echo size. Normally you would use this to drive out like a list of classes or something.

Normally you would use this to drive out like a list of classes or something. So we echo size right here, okay. And then in here, you know, if we type size equals LG and then load the page, we get one LG and one medium, right? 'Cause this one's LG, this one's medium. But what if you didn't wanna specify all of the, like every button in a button group is gonna be the same size? Why put size LG on all of these?

is gonna be the same size? Why put size LG on all of these? Don't you wanna just say size LG way up at the top of the button group and have all of these inherit that value? Well, you can do that. You can say that this button is aware of size props from outside of itself. And if you do this and then you load, it doesn't work. I'm actually, I guess I'm starting

And if you do this and then you load, it doesn't work. I'm actually, I guess I'm starting by showing you the not working scenario. Why doesn't it work? It should work. It doesn't because this is Blaze and this is not Blaze. So at aware does not work across blade, Blaze boundaries. So if we make this one Blaze, like up here, it works, okay?

So if we make this one Blaze, like up here, it works, okay? And the same is true if both of these were not Blaze, fingers crossed and it doesn't work. No, it does. I just have to save the file. It works, okay. So you can see that that basically aware is only gonna work between pure blade or pure Blaze.

Why @aware Is Risky4:13

is only gonna work between pure blade or pure Blaze. If you mix and match them, it will break down. But I think aware, I'm just kinda gonna step on a soapbox real quick. I think aware is an anti-pattern in Blaze or in blade in general. It's so powerful and it's so tempting to use, but you run into gotchas. Like what if I did this?

but you run into gotchas. Like what if I did this? What if I had X modal way somewhere outside of this? And I had like, this is way deeply nested inside a form. And the modal, I also have a size prop. And I say that the size is LG or something like that. And the button group, I don't wanna be large. Now the button group is large because all these buttons inherit size. Aware is not configurable.

because all these buttons inherit size. Aware is not configurable. You can't say only be aware of a single parent or only be aware of a parent whose name is button group. That's just not how it works. It's a little primitive, I guess in that way. And I think aware has bitten me more than any other feature in blade components. So I just wanna give you a cautionary tail right there. But go to the docs, look at the limitations.

Other Blaze Limitations5:07

So I just wanna give you a cautionary tail right there. But go to the docs, look at the limitations. I think everything I've shown you, I imagine your takeaway is, oh, none of this matters. I can just use Blaze as I please and not really think much about it, that is true. But there's some other things. If you use view composers, I don't use those anymore. And I never used them for blade components.

If you use view composers, I don't use those anymore. And I never used them for blade components. What else? There's rendering blade components using view. I never do that. Then class based components. So there you go. Those are the limitations. I think none of them really matter, but we're being exhaustive here.

I think none of them really matter, but we're being exhaustive here. So that's what we're doing. Yep. [BLANK_AUDIO]

دوست دارید گاهی خبرهای Laracasts را ایمیل کنیم؟