デモ

使いかた

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

  1. トップ
  2. tech
  3. Gist に置いた JavaScript のベンチマークをとる

通称のページロードにそれほど時間がかからなくても、XHRでは異常な時間がかかることが良くある。

考えられる原因があまり思いつかない。アップロード帯域を絞られすぎている? XHRではペイロードが大きくなるケースが多くてそう感じる?