[Front-End General] StyleStats で CSS Selector の数を確認する
middleman を利用しているプロジェクトでは compass stats できなかったので、代替手段を探しました。
Contents
経緯
CSS Selector の数を確認しておこうかな。
% compass stats
NoMethodError on line ["3"] of /Users/****/projects/****/config.rb:
undefined method `zone=' for Time:Class
Run with --trace to see the full backtrace
middleman の config.rb であって、compass の config.rb ではないのでそうなりますよね、ということで確認。
middleman には、特に対応するオプションはなさそう。
インストール
stylestats で代替します。
% npm install -g stylestats
実行
色つきの text table で表示されます。
% stylestats build/css/main.css
StyleStats!
┌─────────────────────────────────┬────────────────────────────────────────────┐
│ Style Sheets │ 1 │
├─────────────────────────────────┼────────────────────────────────────────────┤
│ Size │ 18.1KB │
├─────────────────────────────────┼────────────────────────────────────────────┤
│ Data URI Size │ 526B │
├─────────────────────────────────┼────────────────────────────────────────────┤
│ Ratio of Data URI Size │ 2.8% │
├─────────────────────────────────┼────────────────────────────────────────────┤
│ Rules │ 173 │
├─────────────────────────────────┼────────────────────────────────────────────┤
│ Selectors │ 299 │
├─────────────────────────────────┼────────────────────────────────────────────┤
│ Simplicity │ 57.9% │
├─────────────────────────────────┼────────────────────────────────────────────┤
:
ありがとうございます。