JS memo

お洒落にJavaScript。

2019年3月31日21:55

Macでウェブブラウザ速度を比較してみた

メインビジュアル

Macでウェブブラウザ速度を比較してみた

AppleのWebkitが2019年3月27日(日)に公式サイトにてブラウザベンチマークの新バージョン、jetstream2(ブラウザベンチマーク)をリリースしたので、Macでブラウザの速度比較をしてみました。

目次

  1. jetstream2とは?
  2. jetstream2による各ブラウザの測定
  3. まとめ

jetstream2とは?

まず簡単に言うとjetstream2はAppleのWebkitがリリースした新しいJavaScriptのブラウザベンチマークツールのことです。

ブラウザベンチマークツールとはブラウザの反応スピードを測るよ!といった感じのものです。一言でブラウザと言ってもChromeやSafari,IEなどたくさんの種類があり、例えばIEのバージョンだけでも5〜11と多くありますよね。 そのためブラウザやブラウザのバージョンの種類によって反応のスピードも異なってきます。ブラウザベンチマークツールを用いることで各ブラウザのスピードを計測して比較したり、ブラウザのバージョンアップでどれほどスピードが改善されたのかなど調査することができます。 AppleのWebkitは過去にsunspiderやspeedmonster、ARES-6などのベンチマークツールを開発しており、2014年にはjetstream1.0をリリースしました。

今回主題となるjetstream2はjetstream1.0を大幅にアップデートしたものです。

jetstream2のリリースの経緯

2014年にリリースされたjetstream1.0は主にJavascriptの処理速度を計測するツールでしたが、リリース後に以下の2つの大きな変化がありました。

  • ES2015(ES6)の標準化
  • WebAssemblyの開発

ES6とは2015年に発表されたJavaScriptの新バージョンのようなものです。このES6に対応しているベンチマーク、例えばWebkitチームはARES-6を開発、またより多様なカスタマイズが可能となった正規表現のパフォーマンスの測定のためにGoogleのV8チームはWeb Tooling Benchmarkを開発しました。 上記のようにjetstream1.0が開発された後に、数種類のそれぞれ優れた面を持つベンチマークツールが生み出されました。

その頃からWebの構造は複雑化していき、javascriptだけでは対応できない事象が発生、Cや#Cがブラウザで実行できる新しいコードのWebAssemblyが導入されはじめました。そのためWebAssemblyのパフォーマンスを計測するベンチマークも色々開発されはじめます。

Webkitチームはこれらのツールを全て一つにする野望を持ちます。
そして計6個のjavascriptまたはWebAssemblyのベンチマークを観察することでそれらの特性を持ったベンチマーク「jetstream2」が開発されました。

jetstream2の特性

jetstream2は

  • jetstream1
  • Kraken(一部)
  • ARES-6
  • Web Tooling Benchmark(だいたい半分)
  • WebAssembly
  • 新機能

の機能を持っています。

さらにテスト内容はブラウザ全体の速度を計測するのではなく、jQueryや正規表現など64個にわけてスコアを測定するような仕組みになっています。(参照)

jetstream2による各ブラウザの測定

公式サイトでjetstream2を使って各ブラウザのスピードを計測した結果が公表されていました。MacBook Proで計測されています。

最近リリースされたsafari 12.1が一位( ^ω^ )

私もMacBook Proで各ブラウザで3回測定してその平均をグラフにしてみました。

公式サイトとほぼ変わらずsafari 12.1が一位と言う結果に。windowsでもIEやEdgeで実験してみたいです。

まとめ

JetStream2は現在のjavascriptやWebAssemblyの環境に対応するためにJetStreamから大幅にアップデートされました。他のベンチマークツールの良い部分を吸収しているので、今のところJetStream2だけでjavascriptの全ての速度パフォーマンスを測定できるのではないでしょうか。 公式サイトによればJetStream2はまだまだ成長中!とのことなので今後に期待します。