コマンドラインからGoogle Analyticsにデータを記録するGAERをつくった

デベロッパーもGoogle Analyticsをもっと使おう!

GAER

表題の通りのNode.jsのCLIツールを作った。Googleアナリティクスのイベントトラッキングレポートに、下記のように任意のJSONデータを送りつける。

$ npm install -g gaer 
$ gaer -t UA-xxxxx-xx -r reportName path/to/data.json
  Sending [||||||||||||||||||||||||] 100%
  Success: The data is sent to UA-xxxxx-xx

デベロッパーとGoogleアナリティクス

基本的にイベントトラッキングレポートは、ページ遷移をともわないイベント、例えばPDFのダウンロードリンクをクリックした等を計測するために使われる。

// JavaScript
ga('send', 'event', 'クリックイベント', 'PDF', '資料請求');

クリックしたイベントに上記のような関数を実行するので、いろいろ使い勝手がいい機能だ。別にこれはアクセス解析のためだけに使用するんじゃなくて、以前からJavaScriptのエラーが発生したらそのページのURLを記録する等、デベロッパーライクな使い方をしてる人がいたりする。

そうでもなくても、Googleアナリティクスは、『サイトの速度』であったり、『ユーザーの環境』等の、デベロッパーも見るべき指標が多い。だから、もっとみんなGoogleアナリティクス使おうぜってことで、GAERを利用して欲しい。

GAERはMeasurement Protocolを使って、データを記録している。記録するJSONのキー分、ループでPOSTしてるだけだ。

{
  "foo" : 12,
  "bar" : 2.1,
  "baz" : 9
}

こんな感じのシンプルなデータ構造のJSONなら送れる。

モニタリングツールとして使う

なぜ、GAERを作ったのか。StyleStatsという、CSSのヘルスチェックツールがある。下記のように使うとJSONデータでCSSの状態を確認することができる。

$ npm install -g stylestats
$ stylestats -f json -n foo.css
{
  "stylesheets": 2,
  "size": 6682,
  "dataUriSize": 0,
  "gzippedSize": 1992,
  "rules": 86,
  "selectors": 179,
  "simplicity": 0.48044692737430167,
  "mostIdentifier": 2,
  "lowestCohesion": 17,
  "totalUniqueFontSizes": 12,
  "totalUniqueFontFamilies": 1,
  "totalUniqueColors": 6,
  "idSelectors": 0,
  "universalSelectors": 0,
  "unqualifiedAttributeSelectors": 17,
  "javascriptSpecificSelectors": 0,
  "importantKeywords": 0,
  "floatProperties": 4,
  "mediaQueries": 3
}

ファイルサイズがどれだけとか、ルール数がどれだけとか、これだけ見ても多少は役に立つかもしれないが、CSSは絶えず変化するものなので、できればこのデータの推移を把握したいものである。そうなると、データを貯めるのとそれをグラフに出力する作業が必要となる。

今まで、Jenkinsにプロットするやり方や、moniteurというツールを使うやり方を試してみたが、グラフがダサかったり、実装方法がやや複雑だったりして、あんまりしっくりきてなかった。

この人のように、D3.jsを使って、フルスクラッチで作るのが妥当なんだろうけど、なにぶんめんどくさがり屋なのでめんどくさい。

$ stylestats -f json -n https://google.com | gaer -t UA-xxxxxxx-x -r Google

だもんで、上記のような感じで、JSONで書きだした結果をパイプでGAERに渡しても、Googleアナリティクスにレコードさせればよい。

記録したデータは、Googleアナリティクスの『行動』>『イベント』のメニューで確認できる。

まだデータ貯まってなくてアレだけど、まぁこんな感じで確認できるようになった。あとはこれを一日一回とか定期実行させればよい(これも若干面倒だけど、Heroku Schedulerを使うのがお手軽かも)。ほか、PushしたタイミングでCIサーバーのほうで実行するのもありかな。

なにせイベントトラッキングレポートなので、デフォルトではイベントの回数がメインになっているので、カスタムレポートで平均値だけを表示にしたりするのが若干面倒だけど、ここは使い方次第だと思う。GAER用のカスタムレポート作ったので、以下からインポートしてね(Solutions Galleryなんてあるんだね、最近のGAは)。

僕はStyleStatsのデータを記録するためにGAERを作ったけど、皆さんもグラフ作るの面倒くさいなってデータがあったらGoogleアナリティクスにレポートさせれば良いと思う。なんか他にも良い使い方あったら教えて下さい。