3 ms·
After reading the comments, I think a lot of people are getting hung up on the implementation aspect of BEM using XML/JSON to determine markup and such. From wh
by russelluresti 14y ago
After reading the comments, I think a lot of people are getting hung up on the implementation aspect of BEM using XML/JSON to determine markup and such. From what I can see (and this is just my take on it), the BOSS project doesn't require you use any aspect of that type of implementation.
What BOSS does is make it easier to use the CSS selector naming conventions set up in BEM (which, to me, is the value of the BEM approach as I really dislike the HTML abstraction).
I, for one, like the concept of standardizing naming conventions. I'm not a complete fan of BEM, specifically, but I can't argue that it doesn't work.
BOSS seems like it's a tool for people who want to use BEM-style naming conventions in their CSS preprocessors, and, for that, I'd say it works pretty well.
Though, I must admit, I'm not a huge fan of certain aspects of this syntax. The mixins, in particular, I dislike. The mixin is declared as a function: mixin(param1, param2). However, the call to that mixin isn't called like a function, it's called as a key/value pair: mixin: param1, param2. To me, it's just a bit of cognitive dissonance that isn't necessary. Just maintain the function aspect of it - you don't need to make it look like a normal key/value pair (though I get the idea, to have all properties for a selector appear as consistent as possible).
Also, I personally like the unique variable identifier, such as $, that's used in Sass. It keeps you from accidentally using reserved keywords. For example, what would happen if I did the following: sans-serif = Helvetica, Arial, sans-serif. Would it try to implement the second "sans-serif" as the variable value and end up with an infinite loop of "Helvetica, Arial, Helvetica, Arial, Helvetica, Arial..."? Regardless of what actually happens, using the $ for variables is a clear indicator that the item is, indeed, a variable and not a native CSS property, value, reserved word, whatever.