Apple、Google、Microsoft、Mozillaといったテクノロジー大手が協力して開発するベンチマークツール「Speedometer 3.0」が発表されました。

BrowserBench.org - Announcements

https://browserbench.org/announcements/speedometer3/



Improving Performance in Firefox and Across the Web with Speedometer 3 - Mozilla Hacks - the Web developer blog

https://hacks.mozilla.org/2024/03/improving-performance-in-firefox-and-across-the-web-with-speedometer-3/



Speedometerはシミュレートされたユーザーインタラクションのタイミングを測定することで、ブラウザのウェブアプリの応答性をテストするベンチマークツールです。Speedometerの初期バージョンは2014年にWebKitチームからリリースされ、それ以来ユーザーや開発者がより豊かでスムーズなオンラインエクスペリエンスを追及するためのツールとして重宝されてきました。

このSpeedometerの最新バージョンとなる「Speedometer 3.0」が発表されました。Speedometer 3.0はGoogle ChromeのブラウザエンジンであるBlinkを開発するGoogle、FirefoxのブラウザエンジンであるGeckoを開発するMozilla、SafariのブラウザエンジンであるWebKitを開発するAppleという3つの主要なブラウザエンジンの開発者による共同作業として誕生しています。

Speedometer 3

https://browserbench.org/Speedometer3.0/



Speedometer 3.0はこれまでのバージョン同様に、実際のウェブページでのユーザー操作をシミュレートすることによって、ウェブアプリの応答性を測定するよう設計されています。Speedometer 3.0ではパフォーマンスを測定するより良い方法と、現代のウェブ環境を反映したより代表的なテストセットが導入されているとのこと。

Speedometer 3.0はBlink/V8、Gecko/SpiderMonkey、WebKit/JavaScriptCoreといった各主要ブラウザエンジンでサポートされており、このような業界を超えたコラボレーションは今回が初めてのことです。これはコンセンサスに基づいた新しいガバナンスモデルに基づいて開発されており、GitHub上の共有リポジトリから開発に貢献することも可能です。

GitHub - WebKit/Speedometer: An open source repository for the Speedometer benchmark

https://github.com/WebKit/Speedometer/



Speedometer 3.0では複数の新しいテストが追加されています。新しいベンチマークを設計するために、開発陣はブラウザを最適化するために重要だと思われるいくつかの主要なシナリオとユーザーインタラクションを特定することから始めたそうです。

今回追加された新しいテストは、キャンバスとSVGチャートのレンダリング(React Stockcharts、Chart.js、Perf Dashboard、Observable Plot)、コード編集(CodeMirror)、WYSIWYG編集(TipTap)、ニュースサイトの読み取り(Next.js)などをシミュレートするものです。

また、TodoMVCテストも改善されており、HTTPアーカイブのデータに基づいて最も一般的なフレームワークの最も一般的なバージョンに適応するようにコードが更新されています。今回アップデートされたフレームワークとライブラリは以下の通り。

・Angular

・Backbone

・jQuery

・Lit

・Preact

・React

・React＋Redux

・Svelte

・Vue

・ES5とES6を対象としたVanilla JavaScript実装およびウェブコンポーネントバージョン

また、これらのテストのより複雑なバージョンも導入されています。人気のあるウェブアプリのページの重みと構造をより厳密にエミュレートする、多くの複雑なCSSルールを備えたより大きなDOMツリーに埋め込まれています。

これらを組み合わせることでブラウザエンジンのより広範かつ代表的な断面が実行され、ウェブ上のユーザーエクスペリエンスを向上させるために、JavaScript、レイアウト、CSS、グラフィックス、DOM APIを最適化する新しい機会が提供されます。

さらに、Speedometer 3.0のテストランナー自体が改良され、ペイントや非同期タスクなど、ユーザーのアクションに応じてブラウザが実行する作業をより多く測定できるようになりました。Speedometer 2.0は、テストスクリプトを同期的に実行する時間を「同期」時間として測定し、0秒タイマーが起動する前の追加作業を「非同期」時間として測定していました。ただし、これでは、ウェブページのレンダリングを更新するためにブラウザエンジンが行う必要のある一部の作業が失われてしまうそうです。

Speedometer 3.0では、これまで欠落していたレンダリング作業を測定できるようになり、現実世界のコンテンツを最適化する機会をさらに増やしています。このためにrequestAnimationFrameコールバック内のテストスクリプトを「同期」時間として測定し、2番目のrequestAnimationFrameでスケジュールされた0秒タイマーを「非同期」時間として起動します。この非同期時間には、ブラウザエンジンによるページレンダリングだけでなく、テスト自体のタイマーによる作業も含まれることが保証されています。これにより、ベンチマークの精度が大幅に向上し、ブラウザエンジンがこれまで欠けていた作業を最適化するため、ユーザーにとって大きな改善につながるそうです。

他にも、開発者ツールが改善され、ブラウザエンジニアが結果をよりよく理解し、プロファイリングし、テストをカスタマイズできるようになりました。複雑なテストケースの作成と保守を容易にするため、テストランナーアーキテクチャは再設計されています。また、多くのコード品質の向上とネイティブPromise、async/await、クラス、モジュールなど、Speedometer 2.0のリリース時には広く利用可能ではなかった最新の機能への移行も行われています。

なお、Speedometer 3.0の主な目標は現実世界のウェブ環境を可能な限り反映することで、ブラウザがベンチマークスコアを向上させたときに、ユーザーが恩恵を受けられるようにすることです。これについてSpeedometer 3.0の開発チームは「Speedometer 3.0の目標は一般公開前にすでにある程度の成功を収めています。2023年を通じ、各主要ブラウザエンジンのコア最適化により、ウェブ全体のユーザーの応答性の向上が実現しているためです」と述べ、Speedometerの成果がすでに表れていることを強調しています。