Are there alternatives to BEM?

Question

htaccess

Fortunately, I have not found a single other methodology for the frontend. Is it really only YANDEX that they do wisely, and the rest as they have to?
Are there alternatives? Somehow I like it, ugly classes, code redundancy. It is categorically incomprehensible how to use it if the work begins with a ready-made layout. Topics - write again. But I still want everything to be clean and understandable, otherwise in any project everything turns into a cesspool over time.

Answer 1

Strange feeling that this is a troll question. However.
Do you understand that the BEM methodology of naming classes only applies in so far as? None of those who use BEM in life writes all these class names manually, the output code can be heavy, but the part that the developer works with is concise and adequate. Though of course it depends on your design and development skill. In Yandex itself, I assure you, the code is far from always pretty and convenient.
If you are going to translate your site from one approach to another, you will one way or another face a dilemma: rewrite everything or rewrite not everything. Another issue is that an ambivalent approach can cost you much more than a full correspondence.
It is solely in your power not to turn everything into a cesspool. For example, I use a completely trivial approach to layout, which on fairly serious projects has not slipped into hell.
1. More partial data views. Of course, not for every sneeze, but for every more or less abstract part of the model.
2. Each partial view has its own css file.
3. Each element of user interaction is its own js-component.
Normal todo-mvc turns into this structure with this approach:
todo/
todo.view
todo.css
todo.js
todo_test.js
todoitem/
todoitem.partial
todoitem.css
todoitem.js
todoitem_test.js
Each view consists of a small piece of layout, rarely more than 50 lines. Each css and js file is similar. The last project that I did according to this scheme survived two years, about 10,000 layout commits, was a payment wizard, a web application and three admin panels for it, and still functions and changes adequately.

Answer 2

In BEM, you can be sure that you won't override any class you've written before, which is not the case with the usual cascading approach.
And you can also move your elements without getting into the CSS file and without rewriting inheritance.
Of course, all this imposes restrictions, and because of the long prefixes, the code becomes cumbersome. But it's easier to work in a team, it's easier to maintain hundreds of CSS files.
If you don't like long prefixes, you can use the old BEM approach. In simple projects, I do this:
All global classes start with a "b-" prefix.

.b-topic { }
.b-topic .title { }
.b-topic .text { }
.b-topic .text a { }

Thus, we will not overlap in the cascade any global class that we can accidentally inherit.
For example, if I used ".title { }" in the code to style the main headings, then ".b-topic .title { }" would inherit that style. To avoid this, global classes should be prefixed with... ".b-title { }".

Answer 3

Are there alternatives?

When it comes to CSS, for example, operatino.github.io/MCSS or https://smacss.com/
Then, no one forces you to write everything according to BEM, using all the tools that Yandex offers.
You can define your requirements for yourself and follow them, while using some BEM moments that you like.