CSSのカスケーディングを禁止する
rework-rule-bindingという、CSSのカスケーディングを禁止する構文を追加するReworkプラグインを書いた。
Rework
Reworkは、@tjholowaychukや@necolasらが立ち上げているプロジェクト。Reworkのプラグインを書くことによって、開発者は独自のCSSのプリプロセスを定義することができる。Twitter社は、twitter.comでReworkで作ったプリプロセッサーを使用しているらしい。
rework-rule-binding
rework-rule-bindingは、CSSにカスケーディングを禁止する構文を提供する。
(.bind-rule) { padding: 15px; border: 1px solid #999; } /* error */ .bind-rule { padding: 0px; } /* error */ (.bind-rule) { border: none; }
このように、丸かっこ「()」でセレクタを囲むとそのルールセットは束縛（binding）され、カスケーディングできなくなる。
カスケーディング
CSS（Cascading Style Sheets）はカスケーディングという機能により、スタイル指定が段階的に引き継がれる。
rework-rule-bindingはそのカスケーディングを禁止する。これはCSSの思想を否定することかもしれない。 しかしCSSの設計が破綻しやすい原因として、カスケーディングが一役買っているように思う。 そもそも、CSSのような宣言的に記述する言語はそこで定義されたもの（CSSの場合ルールセット）の上書きはされるべきではない。
アート活動
rework-rule-bindingは概念実証として作ったアート作品みたいなもので、 普段の考え方から若干ズレた存在を認識することで、既存の道具の有り様を捉え直せれば良いかなと思ってつくった。
CSSの設計については多くの人に語られており、OOCSS、BEM、SMACSSのように様々な思想（概念）が生み出されてきた。しかしこれらの思想は、CSS職人たちが長年の経験から導き出したもので、初心者がこれを知ったところですぐに実践できるものではない。それに僕には、どれもただの命名規則やコーディング規約のようなものに思えた。
またSassやLess、StylusといったCSSプリプロセッサーはCSSに変数やmixin、条件文等の機能を追加し、CSSをプログラマブルに記述できるようにした。しかしこれらのプリプロセッサーはCSSにシンタックスシュガーを定義したものに過ぎず、DRYを加速させることはできるが本質的にCSSの設計を良くするものではない。
理想的なCSSとは何か。CSSに限った話ではない。今自分が使っている技術、道具は自分にとって一体どういう存在なのか、ということに考えが行くようになれば良い。そして時にはその技術の思想さえも疑い、より良いものにしたい。このようなことを考えてrework-rule-bindingは作られた。
ここまで書いたことは全部嘘で、本当は何も考えてなくて単純に面白ければいいと思ってつくった。
