How the block editor handles CSS (Building in Public - Block Styles Manager Ep 5)

Registering block styles, inline block styles, tree-shaking, the "Styles Engine" - how does the block editor actually load CSS and is this tool going to be good for performance? Plus a quick update on the Block Styles Manager user interface.
👉 Newsletter: www.briancoords.com/newsletter/

[@hujth6]

Hey Brian just wanted to let you know that you are an inspiration to me!
This project is amazing and really interesting and I wish I could do something like that in the future.
About the issue with duplicate registering of block styles, what about adding an if statement to check if the block style was registered, if not register, if yes then continue
p.s.
You said in your podcast that no one is visiting your site, well, I have visited and it’s a really nice website

[@BrianCoords]

That is awesome! Keep me updated on your journey. And re: the block styles, yeah I'm going to need to store a list of registered styles, probably a single instance object or something...

[@rubiotv]

Bro loving the videos. Would love a video of how to effectively get into Wordpress development.

[@BrianCoords]

Thanks! That's a pretty broad topic, but I'm working on a series of videos that might be helpful.

[@rubiotv]

@BrianCoords, let's go. I know, and there's a lot, but it would be great to know if people know some of the fundamentals enough but don't know how to get into the new WordPress development world.

[@Hanneslsm]

Amazing progress!
Would it make sense if the CSS was also minified? Don't know if the style engine is capable of, but I could imagine it would also increase the site performance a little bit when a lot of classes are loaded.

[@BrianCoords]

Yeah I think that's possible. I need to dig further into the WP_Styles class and see if there's maybe a way to get WP to do it for me. developer.wordpress.org/reference/classes/wp_styles/#description

[@Xenio2007]

Great content, could you make a video on how to set up vscode to develop on wordpress? Coding standards and recommended extensions?

[@BrianCoords]

It's on my list! But I think to do it I need to uninstall everything and re-install it just to make sure I'm doing it right. It's been a few years since I've touched it because I'm afraid if I do I'll break everything 😂

[@reyanshxd2043]

Hello, I need to use the experimentalBorder support feature but not on the parent element instead I need to use them on a child layout structure of my component, what should I do to get this functionality? Also, can you please let me know how to use borderBoxControl component? I'm getting a lot of trouble setting up that component or give me any guide on it?

[@BrianCoords]

I haven't messed around with it but from what I'm gathering - you want to use the border controls but you want the CSS classes from those controls to show up on some inner element, so you're using the component separately? If that's the case, then typically I look back at what I'm making and try to determine if it should really be one block or maybe multiple blocks that are locked inside one parent block. (That said, I don't know exactly what you're making so I could be wrong)

[@reyanshxd2043]

@@BrianCoords I understood your point, just forget about innerblocks and everything. Can you please upload a video on borderBoxControl component? I'm unable to use that properly. I can use the boxControl, as well as borderControl but not able to use borderBoxControl because of flat and split borders functionality.