Tech カテゴリー「Gist に置いた JavaScript のベンチマークをとる」以前の3件

2016年 06月 09日

Gist に置いた JavaScript のベンチマークをとる

tech | 21:55 |

デモ

使いかた

gist に以下の命名規則でファイルを作ります

*.js にベンチマーク対象コード
*.js の拡張子をhtml に書いたものに実行するページのHTML
- または common.html に共通の HTML

そして gist の URL をコピーして、このページで実行させます。

挙動

空関数呼び出しも含め、50msごとにそれぞれのコードをできるだけ実行します。これを1フェーズとして、100回実行します。なので、終わるまで対象テストケース×5秒かかります。

コードは対応するHTMLをロードした iframe 内で実行されます。これは文字列から iframe.contentWindow.Function のインスタンスを作ることで実現しています。

Rate limit 対策

Gist から API 経由でデータをとってきていますが、Github の API は Rate limit がキツいです。

一応、localStorage にキャッシュを持っており、gist 側を更新しない限りは 304 を返してもらうようにしています。304 の場合はAPIアクセスしてもカウントされません。

これでも、gist を更新してベンチマークを繰替えすと意味がないので、Personal Access Token による上限拡大も雑に実装してあります。

経緯

jsperf.com が動いていなくて不便ですね。不便すぎるので5年前ぐらいに自分で書いたコードをひっぱりだしてきて、書きなおしたという感じです。

jsperf と比べ、結果を集約したりする機能はありませんが、クライアントサイドのみで動くので気楽なツールです。

このエントリを参照するエントリ

今年やったことを自分で承認する
日記を読みかえしてみたら今年もいろいろやっていた。年末にせめて自分で自分を承認してあげたい。おおまかには高周波関係アンテナアナライザ製作… 00:04

2016年 06月 08日

Google Photo が自動的に場所を推定して表示するようになった

tech | 11:11 |

こんな感じで、Google Photo 上で場所が推定されて表示されるようになっていることに気付きました。

メニューマークをクリックすると明示的に削除もできます。また「撮影場所（推定）」についてのヘルプにリンクがあって以下のように書かれています。

「撮影場所（推定）」とはどのようなものですか？
Google フォトでは、ご利用の Google アカウントに保存されている Google ロケーション履歴などの情報をもとに、撮影場所を推定することがあります。

「ロケーション履歴など」と書いてありますが、ロケーション履歴以外はなんでしょうね。被写体認識も入ってるんですかね。自分は常時ロケーション履歴を有効にしているので、ロケーション履歴がない場合の推定状況については調べられませんでした。

「これどこで撮ったかな〜」と思いつつロケーション履歴を辿るほどでもないなということは多々あったので結構嬉しい気がします。

2016年 06月 04日

video/audio 要素の timeupdate イベントを高頻度にする

tech | 00:26 |

video/audio 要素には再生時間が変わったときに timeupdate イベントが発生します。これは Chrome においては最頻でも 250ms ごとにしか呼ばれません (500ms のときもある)。

もっと頻度をあげてイベントをとりたいと思うことがあったので以下のようにしました。

video.addEventListener('loadedmetadata', function (e) {
	var time = video.currentTime;
	requestAnimationFrame(function me () {
		if (time !== video.currentTime) {
			time = video.currentTime;
			video.dispatchEvent(new CustomEvent("timeupdate"));
		}
		requestAnimationFrame(me);
	});
});

video.addEventListener('timeupdate', function (e) {
	console.log(video.currentTime);
});

requestAnimationFrame で定期的に currentTime を監視して timeupdate を自力で発火させるアプローチです。

元の timeupdate イベントも一応受けとっています。というのも requestAnimationFrame はタブがバックグラウンドにいった場合などに呼ばれる頻度がとても落ちることがあるので、本来のイベントも受けて保険としています。そして「やっぱ高頻度じゃなくてもいいや」となっても該当部分をコメントアウトするだけですみます。