Quantcast
Channel: 小粋空間
Viewing all articles
Browse latest Browse all 219

Google ChromeでサイトパフォーマンスのボトルネックをチェックできるChrome拡張「PageSpeed」

$
0
0


Google ChromeでサイトパフォーマンスのボトルネックをチェックできるChrome拡張「PageSpeed」を紹介します。

PageSpeed

この拡張を利用すれば、「ブラウザのキャッシュを活用する・圧縮を有効にする・CSSスプライトに画像をまとめる」といったパフォーマンスの最適化のための項目や、その詳細なデータを確認することができます。

最適化のための詳細データ

1.インストール

Using PageSpeed Insights for Google Chromeのページにある「Install PageSpeed Insights」またはその左のアイコンをクリック。

Using PageSpeed Insights for Google Chrome

ページ右側にある「CHROMEに追加」をクリック。

CHROMEに追加

「追加」をクリック。これでインストールが開始します。

ダイアログ

インストールが完了しました。

CHROMEに追加

2.使い方

Windowsの場合、測定したいページを表示した状態で「F12」をクリックして、表示されたデベロッパーツールの右側にある「PageSpeed」をクリック。

デベロッパーツール

「分析」をクリック。

PageSpeed

分析が開始します。

分析

分析結果です。中央には提案の概要、左側には優先度(高・中・低)別の対策が表示されます。

分析結果

左側の項目をクリックすれば、詳細な情報が中央に表示されます。

詳細な情報

以前のバージョンではスコア(100点満点で何点か)も表示されていたようですが、確認したバージョンではその表示はありませんでした。


Viewing all articles
Browse latest Browse all 219

Trending Articles