5 подходов к стилизации React-компонентов на примере одного приложения

[MeGaBoJIbT]

Мужик, астанавись! У тебя почти сотня хреновых статей про js/реакт. Кому они нужны?
За то время что их клепаешь уже мог бы разобраться в чем-нибудь нормально и написать одну качественную.

[aivazovski]

А почему CSS-в-JS лучше остальных подходов?

[MaZaAa]

Разумеется ни чем не лучше. Это просто абсолютно другой подход вот и всё.

Тут как бы смехотворный аргумент

На мой взгляд, лучшим решением является последний подход, т.е. CSS-в-JS. Он выглядит самым логичным с точки зрения описания структуры (разметки), внешнего вида (стилей) и логики (скрипта) компонента в одном файле — получаем нечто вроде Все-в-JS.

[aivazovski]

Спасибо.

[JustDont]

Не лучше. Как обычно, есть разные trade-off.
Главные плюсы — упорядоченность через код (можно подключить линтер, TS, и всё вот это) и тьюринг-полный язык действий над стилями.
Главные минусы — вендор-лок (в лучшем случае "ванильный" css можно будет отдать внутрь css-in-js решения как портянку plaintext, см. emotion, в худшем, как в styled-components, нельзя будет и этого) и всегда добавочные тормоза в обработке этого всего (впрочем, не всегда это имеет значение и вообще можно увидеть даже замерами).

[aivazovski]

Спасибо.