AIフレンドリーであるという主張

styled-componentsがメンテナンスモードになり、それを報告する記事内でCSS-in-JS自体を推奨しないという発言があったことを受けて、Tailwind CSSはAIフレンドリーであり破壊的変更が少ないため負債化しにくい最適な選択であるといった声が見られました。

しかし、AIフレンドリーであることと破壊的な変更が少ないことは、少なくとも現在は事実ではないと思います。

注意

私個人がTailwind CSSを毛嫌いしているから、この記事を書いているわけではありません。

現在ブログを運用しているサイトでも利用しているように、選択肢の1つとしては良いと考えています。大衆による使われ方や喧伝のされ方に思うところがあるものの、Tailwind CSSの作者の思想には共感できるところが多くあります。

Tailwind CSSの破壊的変更は誠実でない

Tailwind CSSは、ほぼ全てのメジャーアップデートで、アップグレードガイドラインに明示されていない破壊的変更を行っていると思います。

ユーティリティが廃止されるケースはまだいいですが、ほぼ全てのバージョンでスタイルの変更が入っています。これにより、開発者に気づかれずサイトのデザインが変わってしまっているケースをいくつか目にしています。そしてこれらの変更が、アップグレードガイドラインに分かりやすく明示されたり列挙されていたことはなかったと記憶しています。

またv4では設定や@applyの変更について来られず、未だにv3のままの開発環境が多く見られます。

このようにTailwind CSSは決して破壊的変更が少ないとは言えないですし、その変更の仕方があまり誠実ではなかった歴史があると思います。

Tailwind CSSは現状AIフレンドリーではない

まず、Tailwind CSSの記事の多くはTailwind CSS v3未満のときに書かれたものであるように見えます。加えて、現在多くのモデルが学習した期間とTailwind CSS v4のリリースがずれてしまっているため、追加で知識を与えない限り、多くのモデルは現在のv4の設定やユーティリティの変更を理解していないコードを生成してしまいます。

また、追加で最新の知識を学習させたとしても、次の問題は残る可能性があります：

• ユーザーがプラグインや@applyを使って独自に生やしたユーティリティをTailwind CSSが提供するものと区別できない
• バージョン毎のユーティリティによる差異を認識できない

これらは多くの場合エラーが出ず、検知が難しいため、AIエージェントなどによる自己修復が困難です。

このように、Tailwind CSSは現状AIフレンドリーとは言えない状況にあります。ただし、これはAIの進化によって改善する可能性があります。

まとめ

Tailwind CSSは、少なくとも現在はAIフレンドリーではなく、これまでの破壊的変更の仕方を見ると他のスタックに比べて特段負債になりにくいとは言えない状況にあります。

多くのCSS-in-JSライブラリよりは技術的な理由により負債にならない可能性が高いですが、Tailwind CSSの採用には慎重になるべきです。

個人的には、AIフレンドリーや破壊的変更の少なさのみを考えるのであれば、より生のCSSに近いもの、CSS Modulesなどが優れた選択肢であると思います。