4

システムに新しい要素が追加されるたびに何年にもわたって成長し続ける巨大なCSSファイルと、これらのファイルを参照するJSPページ（さらに他のJSPページなどを含む）がいくつかあります。

使用されなくなったルールや冗長なルールがたくさんあることはわかっています。

新しいツールが出続けています。ディレクトリを分析し、CSSルールのクリーンアップと最適化を支援できるツール（AptanaやW3CのCSSバリデーターなどの明らかなツール以外）はありますか？

4

3 に答える 3

4

Firefox 用のDust-Me-Selectorsプラグインがありますが、もちろん、ディレクトリではなく、ブラウザーでレンダリングされたページを調べます。

于 2009-07-13T14:42:00.217 に答える
3

これはトリッキーな作業です...特に、HTML DOM コンテンツが何らかの方法でオンザフライで生成される場合はなおさらです。

Dust-Me-Selectors プラグインは役に立ちますが、ページごとに見ると、多くのセレクターが使用されません... しかし、necs が無効になるわけではありません。

クリーンアップに役立ついくつかのトリックがあります。

セレクターが使用されているかどうかを判断するために、すぐに見つけられる HORRID スタイルを 1 つずつ挿入します。例えば

border:6px dashed #ffaacc;
padding:12px;

現在、巨大な破線のホット ピンクの境界線でレンダリングされるものはすべて、「アクティブな」セレクターです。サイトやアプリのほとんどを表示せずにサーフィンできる場合は、「死んでいる」可能性があります。

(CSS コードが「生成」されている場合は、これを最適化して一度にさまざまな色でテストし、生成されたコンテンツを使用してセレクターの「id」を追加できます)

生成された CSS システムを使用する場合のもう 1 つのオプションは、生成された URL を含む背景画像を設定する最終的なプロパティをセレクターに追加することです。例えば

#selector_a > .foo{
  ...
  background-image:url('selectortest/id_123.png');
}
#selector_b .bar{
  ...
  background-image:url('selectortest/id_124.png');
}

次に、サイト/アプリをしばらくサーフィンしてから、Web ログで HTTP 画像リクエストを確認します...ログでリクエストされていない生成された画像 URL を確認します...「デッド」セレクターを見つけた可能性があります。

于 2009-07-13T15:38:49.600 に答える