Chromium DashboardのCSS usage metricsとぼくらのusage metrics
火曜にGoogle JapanであったChrome Tech Talk Night #6でライトニングトークをしてきた。
イベント中ずっと資料とコードを書いてて内容をほとんど聞いてないという残念っぷり…こういうのやめたいね。
Chromium Dashboardの概要と、9月に追加されたCSS metricsの紹介と、自分がアクセスしたページならchrome://histograms
からデータとってこれるよという話をした。
資料はこちら。
以下ちょっといろいろ。
CSS usage metricsで気になるところ
すこしある。
- Chromeが解釈できる機能に限定されること
- 現在のところプロパティのみということ
- (たぶん)プロパティの「書かれた回数」をもとにしてないこと
ひとつ目は他のベンダー接頭辞つきプロパティの利用状況がわからないこと。たとえば-moz-border-radius
や-moz-opacity
。Geckoはもう解釈しないけど、使われてるページはまだ多いだろうから、そういうのもわかるとうれしいなと。DevToolsでは他のベンダー接頭辞つきプロパティも表示してるので情報は取れると思うんだけど、むつかしいのかなあ。
ふたつ目は、linear-gradient()
やinput
関連の独自セレクタ、@rule
についてはわからない。ただ値についてはissueが上がっているので、やるひとがいたらなんとかなるかも。
みっつ目はややこしい。ちゃんとソース読んでないので保証できないんだけど、たぶんUseCounterの仕様からプロパティの「書かれた回数」ではなく「出現したか否か」を元にデータを出している。なのでこのmetricsで上位にあるプロパティはWebで多く「書かれている」プロパティではない。「使われている」とは言えると思うけど。そこらへんトリッキー。
ぼくらのCSS metrics
UseCounterを使う関係上、そのデータはGoogleしかわかんないことになる。オープンデータ!とか強く言うつもりはないけど、ちょっとくやしい。
グローバルなデータはないけれど、「ローカル」なデータは手に入る。UseCounterをはじめChromeが集めてるデータはchrome://histograms
で見られる。アクセスするとファンシーなアスキーアートが並んでると思う。DNS関連のあれこれとか、パフォーマンス関連のものが多い。
UseCounterはこの仕組みを使ってるので、このページから探し出せばいい。「ヒストグラム」としては失格だけど、データが手に入るからいいんだ。
で、データの取得がちょっと面倒。なんせ<pre>
なアスキーアートなので。
はじめはXHRで自身をDocumentとして取得して、目的の<pre>
を見つけて、そのtextContent
に正規表現をかけて…ということをやっていた。そしたら先週末くらいにchrome://histograms/FeatureObserver.CSSProperties
とかで絞り込めることがわかって、XHRのところは省けた。すっきり。
Chrome拡張にしようかと思ったのだけど、今のところchrome://
なURLにXHRができない。フラグがあるけど有効にしたら使えるのかな。
そんな中途半端なところでおわった。4分オーバー。すいません。英語むつかしいです。