开发者Andros Fenollosa最近写了一篇长文,标题很直白:《Why I don't recommend Tailwind CSS》。他列了六条理由,结论是中大型项目最好别用这个前端最流行的CSS框架之一。文章逻辑清楚,例子也扎实,唯独漏了一件事——他从头到尾没说清楚自己批评的是哪个版本的Tailwind。这个漏洞不小,因为Tailwind今年推出的v4,恰好在他吐槽最狠的几个点上做了改动。
六条罪状,一半是老账
原文的批评集中在六个维度:工具类多到要背几十个、HTML里堆满class破坏了结构与样式分离、items-center和justify-center这类命名混乱不直观、w-[347px]这种任意值写法让设计系统形同虚设、新手学Tailwind容易学不会真正的CSS、以及@apply用多了HTML照样难读。
作者还挺公道,主动引用了Tailwind创始人Adam Wathan的反方论点——耦合关系并没有消失,只是从"CSS依赖HTML"变成了"HTML依赖CSS",在React、Vue这类组件化框架里这套逻辑本来就成立,因为逻辑、结构、样式早就写进同一个文件了。但作者认为,这个论点在服务端渲染、走传统模板的项目里站不住脚。
这条边界划得挺清楚,问题出在另一半——那些他归咎于框架设计的"痛点",有的其实是版本问题,不是哲学问题。
v4的官方数字,正好戳中原文软肋
Tailwind官方公布的v4引擎数据摆在那:全量构建最高提速3.5倍,增量构建(含新CSS)最高提速8倍,如果内容没变化,重新构建能快100倍以上,常常在微秒级完成。这组数字对应的正是v3时代被吐槽最多的"构建慢、开发体验卡顿"问题。
更关键的是"类检测机制"。v3时期动态拼接类名(比如用变量拼字符串生成class)经常检测失败,样式莫名其妙不生效,逼着开发者去查文档、猜规则——这和原文说的"要开着浏览器标签页查半天"其实是同一类痛。v4新增了@source和显式注册的方式,专门解决这个问题。@apply的行为也变了,v4要求样式表引用更明确,原文里那句"Adam Wathan自己都说@apply基本是骗人的",某种程度上已经是旧版本的历史评价。
原文没交代自己讨论的是v3还是v4,读者很容易把一个已经被官方部分修正的痛点,当成Tailwind的永久缺陷来记。
哪些批评v4治不好
但不是所有批评都能靠版本更新洗白。items-center和justify-center语义不对齐,这是Tailwind从诞生起就有的命名逻辑,跟引擎重写没关系。任意值语法w-[347px]依然存在,v4没有取消这个逃逸口,设计系统的一致性还是得靠团队自律,框架管不了。新手学CSS容易被Tailwind的抽象层挡住路,这也是学习方式的问题,不是性能问题。
- 结论.原文六条批评里,构建慢、类检测失效这两条更像是v3时代的旧账,v4已经动手改过;命名不一致、任意值滥用、学习曲线这三条是设计哲学层面的选择,版本更新解决不了。
- 风险.如果只看这篇文章就下"Tailwind不行"的结论,很可能是拿v3的体验在评判v4的产品,判断本身就跑偏了时间线。
对技术负责人来说,更现实的判断框架其实很简单:项目是组件化架构(React、Vue)还是服务端模板,团队里CSS基础扎实的人多不多,用的是v3还是v4。这三个变量比"推荐还是不推荐"这种二元结论更有用。CSS原生特性这两年也在补课,@layer、原生嵌套、:has()、容器查询都已经不用装任何东西就能用,Tailwind的护城河变窄了一些,但类的可读性和团队协作成本这道题,暂时还没人给出比工具类更简单的答案。
