PageSpeedの【使用していないCSSの削減】を見つけ出すWebサービス 『Unused CSS finder』

PageSpeed Insights内の「使用していないCSSの削減」を
簡単に見つけ出してくれるWebサービス。
チェックしたいURLを入力するだけで
CSSをプロパティ毎に表示します。

目次

リンク先

Unused CSS finder リンク先はこちらから

使い方

使い方は簡単でチェックしたいページのURLを入力するだけです。

ルートURLという事でこのブログだと「https://pc.mogeringo.com」となります。
階層ページなども辿ってくれます。

入力して「CRAWL FOR UNUSED CSS」をクリックするとチェックが始まります。
ページ内のリンクを辿っていきルートURLから検出したページ内で
使われていないCSSプロパティをチェックしてくれるようです。

Doneと記述されそこから使われていないCSSプロパティを表示します。
かなり膨大な数のCSSプロパティが使われていないようです。

PageSpeed Insightsのスコアは100となっていますが、

使用していないCSSの削減という項目でかなりの量のデータがあったので
チェックしてみた所こんなに使われていないCSSがありました。

レビュー

現在Wordpressのテーマ「SWELL」でAutoptimizeというプラグインを使ってみた所
こんなに大量に出てきてしまいました。
恐らくテーマ側で自動でCSSなど最適化してくれているのに
AutoptimizeでCSSをまとめて1つのCSSに最適化した事が原因と思われます。
やはりテーマSWELLで公式でも書いてある通り、Autoptimizeを使うと
不具合が出そうです。
その他のテーマなどでは使われていないCSSの削減の問題を解決するのに
とても便利なWebサービスだと思います。

よかったらシェアしてください!
  • URLをコピーしました!

コメント

コメントする

このサイトはスパムを低減するために Akismet を使っています。コメントデータの処理方法の詳細はこちらをご覧ください

目次