CSS掃除の重要性

CSSは常に掃除し、過不足なく実装しなければすぐ負債化する。

CSSが臭うポイントは以下の通り。これら負債化の予兆なので見逃さないようにする。

• width/height: 100%; … なくても問題ないことがほとんど
• width/height: {n}px; … 固定値はレイアウトが崩れる原因なので注意
• marginで*-top、*-bottom、*-left、*-right が混在 … margin相殺が発生している可能性大
• display: flexの子要素 … あとからflexに変更したときの残骸がある可能性大
• margin … コンポーネント自体にmarginを含めるとろくなことがない
• 複雑なセレクタ … CSSではなくDOM構造が良くない可能性大

CSSのリファクタリングはJavaScriptのそれとは違いテストが書きづらい分、難しい作業になる。ただし難しいから、面倒だからといって放置すると絶対爆発するのでPullRequestを出す前に必ず掃除すべき。