Почему Tailwind не для меня Перевод
Статья за март 2021 года, от Джареда Уайта на сайте dev.to. Которая начинает так: В последнее время я неоднократно спорил в сети по поводу Tailwind CSS. Я не горжусь этим. Я не люблю ссориться ни с кем. Я считаю, что люди, создающие Tailwind, талантливые и приятные люди. Но на чисто техническом уровне мне просто не нравится Tailwind. Для кого бы он ни был построен, он был построен не для меня.
И в каком-то смысле это нормально. Есть тонны веб — технологий, которые там я никогда не буду использовать. Это не значит, что они плохие. Есть множество отличных стеков технологий, которые можно обойти.
Однако проблема, с которой я постоянно сталкиваюсь, заключается в растущем популярном мнении, что Tailwind CSS — это будущее. Так и должно быть. Другими словами, Tailwind самоуверенный и вдохновляет кадры евангелистов. Опять же, на определенном уровне это нормально. Например, Rails очень самоуверен, и мне нравится использовать Rails.
Но Tailwind определенно бросает вызов. Я процитирую непосредственно создателя Адама Уотана, выделенного прямо на сайте Tailwind:
«Лучшие практики» на самом деле не работают.
Я написал несколько тысяч слов о том, почему традиционные «семантические имена классов» являются причиной того, почему CSS трудно поддерживать, но правда в том, что вы никогда не поверите мне, пока не попробуете это на самом деле. Если вы можете подавить желание рвать на достаточно долгое время, чтобы дать ему шанс, я действительно думаю, вы удивитесь, как вы когда-либо работали с CSS каким-либо другим способом.
Вызов принят.
Я пробовала. И я его использовал. Много. Один из моих крупнейших клиентов работает над проектом, основанным на React и Tailwind. Так что, что бы вы ни пошли на меня, вы не можете обвинить меня в том, что я не дал Попутному ветру старую добрую попытку колледжа.
Все еще не мое. Вообще. На самом деле у меня есть некоторые серьезные опасения по поводу Tailwind, и что меня в высшей степени расстраивает, так это то, что всякий раз, когда я поднимаю эти опасения, я сразу получаю отпор от стойких фанатов Tailwind, которые обвиняют меня (во многих словах) в том, что я просто гребаный идиот. Мне как программисту, работающему в веб-индустрии полный рабочий день с конца 90-х, это не подходит.
Так как комментарии Twitter и Hacker News явно не подходят для технических разговоров такого масштаба, я попытаюсь обрисовать реальные причины, по которым Tailwind не для меня.
Причина 1. Tailwind продвигает уродливый HTML
Первая причина — эстетическая проблема, но она тесно связана с реальными техническими проблемами, которые я кратко опишу. Но, по крайней мере, я ненавижу то, как выглядит HTML, предназначенный только для CSS.
Ненавижу, ненавижу, ненавижу. Адам даже признает это в лоб, когда умоляет нас «подавить желание рвать достаточно долго, чтобы дать ему шанс…». Это негласное признание того, что написание разметки таким способом поначалу кажется уродливым и странным, но каким-то образом мы в конечном итоге просто «преодолеем это», потому что преимущества настолько велики.
Извините, ребята! Вы никогда не заставите меня оценить это:
Ep. 128
Scaling CSS at Heroku with Utility Classes
Full Stack Radio
Я уже слышу, как многие из вас кричат мне на экраны компьютеров, говоря мне:
«Чувак, просто используй, @apply если хочешь сохранить свой HTML в чистоте! Проблема решена»
Что ж, это потенциальное решение, и на самом деле это то, что мы сделали в вышеупомянутом проекте. Но это подводит меня к следующему вопросу.
Причина 2: @apply принципиально несовместима и нестандартна (и во многом ненужна).
Именно здесь многие фанаты Tailwind сбиваются с толку и продолжают спорить со мной снова и снова, поэтому я постараюсь объяснить это как можно яснее и очевиднее.
@apply mt-3 в файле CSS работает, только если вы используете Tailwind. Это требует присутствия Tailwind в процессе сборки. Если вы удалите Tailwind из процесса сборки, этот оператор не будет работать, и ваш CSS сломается.
Хотя это правда, что вы можете взять сгенерированный выходной CSS-код сайта и использовать его без Tailwind, обычно это объединенная компиляция из десятков, если не сотен небольших CSS-файлов, разбросанных по кодовой базе (если вы пишете файлы CSS для каждого компонента, как мы). Это не то, на что можно рассчитывать в отношении исходного кода.
Следовательно, это просто правда, что файлы CSS, созданные для Tailwind, нестандартны (так называемые проприетарные) и принципиально несовместимы со всеми другими фреймворками и инструментами CSS. Если вы пойдете по Tailwind, вы никогда не сможете уйти.
И в качестве дополнительного бонуса написание всех ваших файлов CSS @apply везде, в основном, означает, что вы не изучаете и не создаете CSS. Вы пишете Tailwind. Сколько бы раз вы ни писали @apply flex
, это не то же самое, что писать display: flex
.
Теперь я понимаю, что у большинства из нас нет привычки регулярно менять фреймворки CSS в проектах. Но поверьте мне, я сделал это! Я сейчас работаю над клиентским проектом, мы переходим с Foundation на Bulma. Хотя это правда, что для этого требуется обновить кучу HTML и некоторые используемые таблицы стилей, будьте уверены, что любые пользовательские элементы стиля, которые мы написали ранее, снова будут работать без проблем, потому что, когда вы пишете простой старый CSS (или даже Sass), он просто работает несмотря ни на что.
Продолжение: dev.to/jaredcwhite/why-tailwind-isn-t-for-me-5c90 (страница на 24.08.2024 удалена)
…И поэтому Tailwind не для меня.
Почему опубликовал?
Возможно критика Tailwind будет кому-то интересна.
Сам слежу за слабыми и сильными сторонами разного ПО в той области чем занимаюсь. Это знать возможно надо.
Автору повезло, ему не особо нравится Tailwind, мне вообще не особо что нравится. ) Tailwind, Bootstrap, UIkit и т.д. Нет идеальных вещей. В одном одно, в другом другое. Вот сейчас делают тут css, и он так себе. И нарекания к Tailwind применимы, добавил компоненты (чтобы использовать и то и то). Хорошо, давайте напишем их (из существующих переменных), и… сделаем Bootstrap. Смысл тогда было использовать что-то другое?
А есть подход, всё больше использовать js. К этому, вообще не очень отношусь, точно не моё. Работать с одним (css и html) а использовать другое — js, переопределять и т.д. — не знай.
Tailwind — это здорово, но тот, кто не разбирается в создании CSS-макетов, не сможет волшебным образом понять тот же макет с классами Tailwind.
Подозреваю, что порог входа у Atomic CSS подхода, выше. Пример:
pr20
— вы знаете что это:padding-right: 20px;
? А вы знаете, что такоеpadding
? Тут пиксели, а есть там еще иem
, а в чём разница? И другое…Я хочу сказать, что в Bootstrap есть например, КНОПКА (
.button
). Я могу не знать css и добавить её в шаблон, тут я должен.