PageSpeed Insights内の「使用していないCSSの削減」を
簡単に見つけ出してくれるWebサービス。
チェックしたいURLを入力するだけで
CSSをプロパティ毎に表示します。
目次
リンク先
使い方
使い方は簡単でチェックしたいページの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サービスだと思います。
コメント