[この記事は Shubhie Panicker、Performance Powerhouse による Chromium Blog の記事 "Chrome 52 Beta: CSS containment, simpler performance measurement, streamable responses from service workers, and more options for web push" を元に翻訳・加筆したものです。詳しくは元記事をご覧ください。]

特に記載のない限り、下記の変更は Android、Chrome OS、Linux、Mac、Windows 向けの最新の Chrome ベータ版に適用されます。

CSS Containment

リッチでインタラクティブなエクスペリエンスはウェブの要ですが、その複雑さのためにレンダリングに長い時間がかかる場合があります。現在 Chrome では、ヒューリスティックを利用し、ページの変更箇所を特定することで、レンダリングの性能を向上しています。ページ全体を 1 秒に 60 回レンダリングするのではなく、変更箇所のみが更新されます。しかし、要素は親要素の範囲を超えて表示される可能性があるので、ある要素への変更は、同ドキュメント内のあらゆる要素に影響する場合があります。そのため、レンダリング実行中に Chrome が考慮しなければならない要素の数が大幅に増加します。

今回のリリースの新機能として提供される CSS containプロパティを使えば、デベロッパーは、子要素が範囲外に表示されることを防止することができます。要素が更新された場合に、Chrome は親ノードの範囲外の要素をすべて無視できるため、レンダリングにかかる時間を短縮することができます。

Performance Observer

正確な RUM（real-user measurement）データの収集は、サイトのユーザー エクスペリエンスを損なうようなパフォーマンスの問題や低下を検知する上で非常に重要です。Chrome の DevTools で、ローカルサイトのテストは実施できますが、多種多様なデバイスを使う現実のユーザーに対するサイトのパフォーマンスを測定することは容易ではありません。Chrome の最新バージョンでサポートされる Performance Observer API を使えば、動作中の RUM データを簡単、効率的に収集することができます。更新に対するポーリングの代わりに、各サイトが興味のあるメトリクスを指定することが可能です。該当メトリクスのデータポイントが新たに利用可能となると、ブラウザがその旨をサイトに通知します。

ReadableStreams による Service Worker のレスポンス向上

HTTP レスポンスをストリーミングすることで、ブラウザは、データ量の大きな HTML ドキュメントを、レスポンス全体が利用可能となる前に順次レンダリングすることができます。最新バージョンの Chrome では、ストリーミングのサポートを追加することにより、Service Workder の動作を向上します。サイトは、Response コンストラクタに ReadableStream を渡すことにより、Streams API を使ってストリーミング可能な Response オブジェクトを構築できます。
オフライン Wikipedia クライアントで Readable Streams による速度向上を確認できます。

Web Push プロトコルと VAPID のサポート

プッシュ通知は、ウェブアプリとの関わり方を新たなレベルに押し上げましたが、これまでデベロッパーは、異なるブラウザに対し異なる API と特定のプッシュ メッセージ配信サービスを使う必要がありました。Chrome は今回のリリースで、プッシュ サービスを提供するサイトのサーバーを認証するための標準である VAPID のサポートを開始しました。VAPID を使うと、サイトに Firebase Cloud Messaging エンドポイントが与えられ、これにより、異なるブラウザ間の Web Push プロトコルがサポートされます。

今回のリリースに追加されたその他の機能