Page Speed Insightsの情報をGoogle Apps Scriptで取得する方法

10175 ワード
GoogleAppsScript PageSpeedInsights GoogleAppsScript テキストリンク

Page Speed Insights

Page Speed InsightsはWebサイトのパフォーマンス診断などを行ってくれるサービスです。URLを指定するだけで、デスクトップとモバイルのパフォーマンススコアとUXスコア（モバイルのみ）を表示してくれます。

Page Speed Insightsのサイトから利用できるほか、Chrome拡張やFirefox拡張でも利用することができます。

Page Speed InsightsをGoogle Apps Scriptから利用

Page Speed InsightsはAPIも提供していますので、各種アプリケーションからPage Speed Insightsのデータを取得することができます。

今回はGoogle Apps Scriptから利用する方法を説明します。これにより、たとえばGoogleスプレッドシートに自社のサイトのURLを並べておけば、それに対するPage Speed Insightsのスコアや各種情報を一覧の形式で見ることなどが可能となります。

ステップは次のとおりです。

  • APIキーを取得
  • スクリプト作成（以下のサンプルをコピー）
  • 欲しいSpeed Insightsのデータを指定して利用

APIキーの取得

Google Developer Consoleから取得します。詳しくはこちらから。

スクリプト作成

以下を参考にスクリプトを作成します。

PageSpeedInsights
function pageSpeed(url, strategy, locale) {
  var APIkey = '取得したAPIキー';
  locale = locale || 'ja_JP'; // default is 'en'
  strategy = strategy || 'desktop'; // 'desktop' or 'mobile'
  var url = 'https://www.googleapis.com/pagespeedonline/v1/runPagespeed?url=' + url + '&key=' + APIkey + '&local=' + locale + '&strategy=' + strategy;

  try {
    var response = UrlFetchApp.fetch(url, {muteHttpExceptions: true });
  }
  catch (err)
  {
    Logger.log(err);
    return(err);
  }

  var parsedResult = Utilities.jsonParse(response.getContentText());
  var pageSpeedResults = {};

  pageSpeedResults['score'] = parsedResult.score;
  //Logger.log(pageSpeedResults);

  var pageStats = ['numberResources', 'numberHosts', 'totalRequestBytes', 'numberStaticResources', 'htmlResponseBytes', 'cssResponseBytes', 'imageResponseBytes', 'javascriptResponseBytes', 'otherResponseBytes', 'flashResponseBytes','textResponseBytes', 'numberJsResources', 'numberCssResources'];

  for (var i=0; i < pageStats.length; i++) {
    var key = pageStats[i];
    pageSpeedResults[key] = parsedResult.pageStats[pageStats[i]];
    //Logger.log(pageSpeedResults);
  }

  return(pageSpeedResults);
}

APIkeyには取得したAPIキーをコピペします。

この例では、スコアとPageStatsの各種情報（ページを構成する各種リソースのサイズや数）を扱うようにしていますが、それ以外の情報を扱う場合はPage Speed Insightsが返すJSONから取得するようにします。JSONで返却されるレスポンスはここをご覧ください。

スクリプトでの利用

作成した関数は次のように利用できます。

sample
// http://qiita.com/ のデスクトップのPage Speed Insightsのスコアを取得
var desktopScore = pageSpeed('http://qiita.com/').score;

// モバイルのスコアを取得
var mobileScore = pageSpeed('http://qiita.com/', 'mobile').score;

// デスクトップのHTMLリソースのサイズ（バイト）を取得
var htmlSize = pageSpeed('http://qiita.com/').htmlResponseBytes;

Googleスプレッドシートの中での関数として利用することもできますが、大量のURLを処理する場合は時間がかかりますので、スクリプトを組んで必要な時に値を取得するほうが良いでしょう。