Panda Noir

JavaScript の限界を究めるブログでした。最近はいろんな分野を幅広めに書いてます。

いかにSnowballがすごいのか語りたいです

Snowballが全然検索ででてこないのでSnowballの魅力を語りたいと思います。といっても魅力がわかりづらいので対比形式でやりたいと思います。

他のツールの問題点

CSS圧縮をするツールはSnowballの他にもたくさんあります。しかし、デザインがくずれてしまったりします。
たとえば、登録されていないプロパティを消す機能です。たしかに、 asdfghjk:3px; みたいなプロパティを消した方がいいというのは理解できます。しかし、更新されておらず、CSS3のbox-shadowなどが消されてしまい、デザインが崩れてしまいます。デザインを崩さないがモットーなので、Snowballではとりあえずこの機能は実装しておりません。

まだまだ問題点があります。@media screen and (max-device-width:480px)の「and」と「(」の間のスペースを消してしまい、スマートフォンでの表示が崩れてしまう問題です。これはいたいですね。スマートフォンな分、実機での確認を行わなかったりしますよね。

つづいての問題は、border:1px solid #CCCなどを border:1px solid#CCCにしてしまう問題です。これはもう言うまでもないですよね。

最後にもうひとつ。これが多分最悪です。なんと、セレクタのスペースを破壊するのです。たとえばbody #hogeとあったら、body#hogeとなります。これ、全然意味が違いますよね。

上に上げたものすべてが実在します。本当です。
また、CSS圧縮といいつつ、Javascriptの圧縮とあわせているところも多く、CSSを真に圧縮する事ができないところが多いです。

Snowball独自の機能

ここまで他のツールの問題点をあげてきました。しかし、他のところがほとんど実装していない機能がSnowballにはたくさんあります。たとえば0pxや0%などの時に0として単位をはぶく機能や、paddingやmarginを最適化する機能です。これらを使えば、より圧縮する事ができます。

終わりに

いかがでしたか。Snowballが使いたくなったもしくは使ってみて便利だったと思う方が一人でも多くいることを祈ります。