2 月にウェブ プラットフォームを導入

2023 年 2 月に Stable 版とベータ版のウェブブラウザに導入された興味深い機能をいくつかご紹介します。

安定版ブラウザのリリース

2023 年 2 月に、Firefox 110Chrome 110 が安定版になりました。これがウェブ プラットフォームにとってどのような意味を持つのかを見ていきましょう。

3 つのエンジンのコンテナクエリ

Firefox 110 ではサイズ コンテナ クエリがサポートされており、この重要な機能を 3 つのエンジンすべてで使用できます。

対応ブラウザ

  • 105
  • 105
  • 110
  • 16

ソース

CSS の頭文字

Chrome 110 では、CSS の initial-letter プロパティのサポートが追加されています。このプロパティは、最初の文字が後続のテキスト行にシンクする行数を設定します。詳しくは、CSS のイニシャル文字でドロップ キャップを制御するの投稿をご覧ください。

対応ブラウザ

  • 110
  • 110
  • x
  • 9

ソース

ReadableStream の非同期反復処理

Firefox は、ReadableStream に非同期イテラブル プロトコルのサポートを追加しました。

AudioContext.setSinkId()

Chrome では、AudioContext.setSinkId が出力に使用するオーディオ機器の ID を設定します。これにより、AudioContext は、ユーザーが選択した接続済み出力デバイスに音声をルーティングできます。

この機能について詳しくは、ウェブ オーディオで出力先デバイスを変更するの投稿をご覧ください。

対応ブラウザ

  • 110
  • 110
  • x
  • x

ソース

iframe 認証情報なし

また、Chrome では、iframe 認証情報不要により、新しい一時的なコンテキストを使用してサードパーティの iframe でドキュメントを読み込むことができます。iframe 認証情報不要は、COEP 認証情報不要を一般化したものであり、COEP がデプロイされない可能性のあるサードパーティの iframe をサポートします。これにより、サードパーティの iframe が COEP ページに埋め込むために COEP をサポートする必要があるという制約がなくなり、クロスオリジン分離の導入を検討しているデベロッパーにとっての障害となります。

詳しくは、iframe 認証情報なしをご覧ください。

対応ブラウザ

  • 110
  • 110
  • x
  • x

早期安定版

Chrome 110 では、Chrome のリリース スケジュールも変更されています。安定版の早期リリースは、一般リリースの 1 週間前にごく一部のユーザーを対象にリリースされます。この変更について詳しくは、Chrome 110 からのリリース スケジュールの変更をご覧ください。

ベータ版ブラウザのリリース

ベータ版ブラウザのバージョンでは、次の安定バージョンのブラウザのプレビュー機能が提供されます。この機会に、自分のサイトがリリースされる前に新しい機能や削除をテストすることをおすすめします。新しいベータ版は Firefox 111Safari 16.4Chrome 111 です。これらのリリースは、プラットフォームに多くの優れた機能をもたらします。主な内容については、リリースノートをご覧ください。

Firefox では、File System Access API を使用する際に Origin Private File System(OPFS)のサポートが追加されました。

Chrome には、CSS カラーレベル 4 で説明されているすべての機能が含まれています。これには、デバイスに依存しない 4 つの色タイプ(lab、Oklab、lch、Oklch)、color() 関数、グラデーションやアニメーションのユーザー定義の色空間が含まれます。また、CSS Color 5 の color-mix() 関数も含まれています。

新しい色タイプと空間について詳しくは、高精細 CSS カラーガイドをご覧ください。

Chrome には View Transitions API も含まれており、シングルページ アプリケーション(SPA)で洗練された移行を行うことができます。詳細については、ビュー遷移のドキュメントをご覧ください。

また、Chrome 111 には宣言型 Shadow DOM が導入され、HTML で直接 Shadow DOM を実装して使用する新しい方法です。

Safari 16.4 は、このプラットフォームの大規模なリリースを約束します。CSS については、このリリースには、:user-invalid 疑似クラスと :user-valid 疑似クラス、margin-trim プロパティ、メディアクエリの範囲構文、CSS Properties and Values API および @property のサポートが含まれます。

Safari は、Web Push、Badging API のほか、さまざまなウェブ API をサポートしています。多くの機能が相互運用性を実現する、非常に画期的なリリースです。

「ウェブの新機能」シリーズの一部