11 月にリリースされたウェブ プラットフォームの新機能

2024 年 11 月に安定版とベータ版のウェブブラウザに導入された興味深い機能をご紹介します。

公開日: 2024 年 11 月 27 日

2024 年 11 月に、Firefox 133Chrome 131 が安定版になりました。この記事では、ウェブ プラットフォームに追加された新機能を紹介します。

WebCodecs API

Firefox 133 は、WebCodecs APIImageDecoderImageTrackListImageTrack インターフェースをサポートし、メインスレッドとワーカースレッドからの画像のデコードを可能にします。

Browser Support

  • Chrome: 94.
  • Edge: 94.
  • Firefox: 133.
  • Safari: not supported.

Source

WorkerNavigator permissions プロパティ

Firefox 133 は WorkerNavigator.permissions もサポートしています。

Browser Support

  • Chrome: 43.
  • Edge: 79.
  • Firefox: 133.
  • Safari: 16.4.

Source

@page 余白ボックス

Chrome 131 では、ウェブドキュメントの印刷時や PDF としてのエクスポート時に、ページの余白ボックスがサポートされるようになりました。

@page マージン ボックスを使用すると、ページの余白領域にコンテンツを定義できます。たとえば、ブラウザによって生成された組み込みのヘッダーとフッターを使用するのではなく、カスタムのヘッダーとフッターを指定できます。

ページ番号用のカウンタもサポートされています。仕様では、現在のページ番号の page とページの合計数を示す pages の 2 つの特別なカウンタ名が定義されています。

詳しくは、CSS を使用して印刷されるページの余白にコンテンツを追加するをご覧ください。

Browser Support

  • Chrome: 131.
  • Edge: not supported.
  • Firefox: not supported.
  • Safari: not supported.

相対色構文での currentcolor のサポート

Chrome 131 では、CSS の相対色(from キーワードを使用)で currentcolor をベースとして使用できるようになりました。これにより、要素のテキストの色に基づいて、その要素の枠線、シャドウ、背景に補色を設定できます。

Uint8Array メソッド

Firefox 133 では、base64- と 16 進数でエンコードされた文字列とバイト配列との間の変換を容易にするための新しい Uint8Array メソッドがいくつか追加されました。

  • Uint8Array.fromBase64()Uint8Array.fromHex()
  • Uint8Array.prototype.setFromBase64()Uint8Array.prototype.setFromHex()
  • Uint8Array.prototype.toBase64()Uint8Array.prototype.toHex()

Browser Support

  • Chrome: not supported.
  • Edge: not supported.
  • Firefox: 133.
  • Safari: 18.2.

Source

専用ワーカーでの WebHID

Chrome 131 では、専用ワーカー コンテキスト内で WebHID が有効になります。これにより、HID デバイスからの大量の I/O とデータ処理を別のスレッドで実行できるため、メインスレッドのパフォーマンスへの影響を軽減できます。

Browser Support

  • Chrome: 131.
  • Edge: 131.
  • Firefox: not supported.
  • Safari: not supported.

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

ブラウザのベータ版では、ブラウザの次の安定版に含まれる機能のプレビューを利用できます。リリース前に、サイトに影響する可能性がある新機能や削除をテストできます。新しいベータ版は、Firefox 134Safari 18.2Chrome 132 です。これらのリリースでは、プラットフォームに多くの優れた機能が追加されています。詳細については、リリースノートをご覧ください。以下にその一部をご紹介します。

Safari 18.2 には、Firefox でリリースされたとこの投稿で前述した Uint8Array メソッドと、今月 Chrome でリリースされた @page マージン記述子が含まれています。ドキュメント間のビュー遷移、ruby-aligntext-box-trim のサポートなど、新しい CSS 機能のリストがあります。

Chrome 132 では、writing-mode CSS プロパティの sideways-rl キーワードと sideways-lr キーワード、<dialog> のトグルイベント、Request インターフェースと Response インターフェースの bytes() メソッドがサポートされています。

Firefox 134 の詳細はまだ不明ですが、Safari 18.2 ベータ版にも含まれている Promise.try が含まれるようです。