Какие плюсы и минусы Atomic CSS

А, слушай, вот эта ваша мода на атомарные стили, Tailwind там всякий... Ну, блядь, как же без этого сейчас, да? Все такие: "О, смотри, я супер-пупер-современный разработчик, я пишу классы прямо в HTML, я красавчик!" А по факту — просто лень в отдельный файл залезть, сука.

Ну ладно, давай по пунктам, как у нормальных людей, а не как у этих, блядь, фанатиков.

Что там у них хорошего-то, эти атомарщики?

• CSS файл — вообще огонь, маленький. Генерируется только то, что реально используешь. Никакого этого старого говна, где на 10 килобайт кода, а на странице — три кнопки. Чистая экономия, блядь. Браузер не ебёт мозг лишним.
• Переиспользование на максимум. Один класс — одно правило. Хуяк — p-4, и везде, где этот класс, будет padding: 1rem. Никакого дубляжа, как в тех говно-проектах, где у тебя три класса btn, button и .header .actions a делают одно и то же. Пиздец просто.
• Поддерживать — вообще заебись. Не надо выдумывать, как назвать этот ебучий блок, который и не блок вовсе, а так, херня какая-то. Хочешь отступ — mb-2, хочешь цвет — text-red-500. Всё, пизда, вопросов нет. Изоляция полная, один компонент другому не нагадит.
• Предсказуемость, как у будильника. Где бы ты ни написал rounded-lg, скругление будет одинаковое. Никаких внезапных переопределений где-то в глубине main.css, которые тебе всю верстку, сука, разъебали.

А теперь, блядь, ложка дёгтя, потому что без неё — никак:

• Читать HTML — это пиздец. Смотри сам, вот этот уродский кусок: class="px-4 py-2 bg-blue-500 text-white rounded hover:bg-blue-700". Это что за хуйня? Это ж надо в документацию лезть каждый раз, чтобы понять, что px-4 — это отступ по иксу! А если таких классов двадцать? Глаза сломаешь, блядь. Раньше хотя бы btn-primary написал и всё, понятно, что это кнопка, а не ёбаный пасхальный кролик.
• Учиться надо, блядь. Это не просто CSS, это новый язык, сука. mt-4, mb-8, mx-auto. А если надо что-то посложнее? @apply? theme()? Да ёпта, проще в институт обратно поступить, чем все эти утилиты запомнить.
• Гибкость — нулевая. Захотел ты, например, красивую, плавную анимацию на трансформации с кубиком-бизье... А хуй там! Либо пишешь свой кастомный CSS (и тогда зачем тебе Tailwind?), либо пляшешь с бубном, генерируя классы через @layer. Проще на хуй послать и сделать по-старинке.
• Без инструментов — ты никто. Хочешь оптимизацию? Держи PostCSS, плагины, конфиги. А то получишь на выходе мегабайт неиспользуемых стилей. Раньше, блядь, файлик CSS написал, в хедер вставил — и работало. А тут целый ритуал сборки нужен.

Короче, смотри пример, сам всё поймёшь:

<!-- Вот это атомарный CSS (по типу Tailwind) -->
<!-- Выглядит, будто кот по клавиатуре прошелся, ей-богу -->
<button class="px-4 py-2 bg-blue-500 text-white rounded hover:bg-blue-700">
  Click
</button>

<!-- А вот это старый, добрый, понятный способ -->
<!-- Открыл файл со стилями, прочитал `.btn-primary` — и сразу ясно, что это за хрень -->
<button class="btn-primary">Click</button>

Вот и думай теперь. Либо ты модный, но пишешь непонятную хуйню, либо старомодный, но зато у тебя всё читаемо. Выбор, блядь, не самый простой.