macOS版Firefox 70は6割以上も電力消費量を削減することに成功している

Mozillaは、Firefox 70からmacOS上でのウィンドウ表示方法を変更したことを発表しました。これにより、画面処理によるPCへの負担が減り、ブラウジング中の消費電力を3分の2以上削減できるとのことです。

Dramatically reduced power usage in Firefox 70 on macOS with Core Animation – Mozilla Gfx Team Blog
https://mozillagfx.wordpress.com/2019/10/22/dramatically-reduced-power-usage-in-firefox-70-on-macos-with-core-animation/

Mozillaによると、Firefox 69まではウィンドウの表示は主に以下の3ステップで行われるとのこと。

ステップ1：ピクセルをGeckoのグラフィックスレイヤーに描画します。

ステップ2：描画処理されたグラフィックスレイヤーは、コンポジターによって1つのイメージに合成され、ウィンドウのレンダリングが行われます。

ステップ3：OSのウィンドウマネージャーが画面上のウィンドウを組み立てて、コンテンツを生成します。

Firefox 70ではステップ2とステップ3で改善が図られたとのこと。macOS版Firefoxのコンポジターは、OpenGLとよばれるグラフィックスAPIを介したハードウェアアクセラレーションを利用します。しかし、macOSではOpenGLのレンダリングコンテキストの中でどこが変更されたのかを示す方法が提供されません。そのため、Windowsでは部分再描画が可能であるのに対して、macOSでは常に全画面再描画が行われ、より多くの電力を消費してしまいます。

そこでMozillaは、macOSに搭載されているUI表現の描画処理を行うミドルウェアCore Animationを利用することにしました。

Core Animationではコピーを最小限に抑える方法でGPUバッファをウィンドウマネージャと共有できます。Firefox 70がIOSurfaceを作成し、それをオフスクリーンフレームバッファとして扱うことでOpenGLを使って直接レンダリングし、作成したIOSurfaceをCALayerに割り当てることができます。そして、ウィンドウマネージャがそのCALayerを画面上に合成すると、追加のコピーなしでGPUバッファから直接読み込まれます。

Core Animationを使用すると、ウィンドウ内の複数の場所に同時にレンダリングし、同期させて更新することができます。また、レンダリングされたコンテンツをウィンドウ内で簡単に移動可能だとのこと。これによって、スクロールを効率的に行うことができるとMozillaは述べています。

Core Animationの利用によって、macOS上でのFirefox 70のレンダリングは以下のようになったとのこと。

ステップ1：ピクセルをGeckoのグラフィックスレイヤーに描画します。
ステップ2：Firefoxコンポジターが、ウィンドウ内のCALayer正方タイルごとに関連するGeckoのグラフィックスレイヤーを組み合わせて、CALayerの変更された部分を再描画します。
ステップ3：OSのウィンドウマネージャーが、画面上で更新されたすべてのウィンドウとCALayerをアセンブルし、コンテンツを生成します。

以下のグラフは、2013年モデルのMacBook Pro(macOS 10.14.6)上で、Firefox 69(青)とFirefox 70(赤)でさまざまなタスクを行った時の電力消費を棒グラフで表したもの。Mozillaによると、Firefoxは多くの場合で電力使用量を3分の1以上まで抑えることが可能とのこと。

Firefox 69使用時の電力消費やCPUのクロック周波数、温度、使用率のグラフはこんな感じ。

それに対して、Firefox 70使用時のグラフが以下。確かに電力消費量や温度はFirefox 69使用時に比べて下がっていることがわかります。

Mozillaは、Firefoxのブラウジングを高速にするWebRender機能もmacOS環境に適応させることで、ブラウザのスクロールや全画面描画の効率をさらに上げることも視野に入れていると述べました。