10 月に初めてウェブ プラットフォームを導入

2023 年 10 月に安定版およびベータ版のウェブブラウザでリリースされた、興味深い機能をいくつかご紹介します。

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

2023 年 10 月に、Firefox 119Safari 17.1Chrome 118Chrome 119 が安定版になりました。この投稿では、ウェブ プラットフォームへの影響について説明します。

Firefox 119 の JavaScript の機能

Firefox 119 では、JavaScript 配列のグループ化に Object.groupByMap.groupBy の静的メソッドが使用されています。

対応ブラウザ

  • 117
  • 117
  • 119
  • 17.4

ソース

Firefox 119 には、StringisWellFormed() メソッドと toWellFormed() メソッドもあります。これらを使用すると、文字列に整形式の Unicode が含まれているかどうかをチェックでき、正しい形式の Unicode に文字列をサニタイズできます。これらのメソッドは、3 つの主要なエンジン間で相互運用できるようになりました。

対応ブラウザ

  • 111
  • 111
  • 119
  • 16.4

ソース

HTML <search> 要素の相互運用が可能になりました

Chrome 118 には <search> 要素が追加されています。これは、ドキュメントまたはアプリケーションの検索やフィルタリングに使用される部分を表す新しい HTML 要素です。この機能は、3 つの主要なエンジン間で相互運用できるようになりました。

対応ブラウザ

  • 118
  • 118
  • 118
  • 17

ソース

選択要素内の水平ルール

Chrome の 2 つのバージョンが 10 月にリリースされました。Chrome 119 では、HTML の <select> 要素に小規模な要素が追加されています。オプション間に水平方向の規則を追加し、アイテムを区切り線として表示できるようになりました。詳しくは、水平ルールを使用した要素の選択をご覧ください。

CSS スコープ

Chrome 118 には、@scope ルールを持つスコープ CSS が含まれています。このルールは、DOM のサブツリー内の要素を選択する方法を提供します。詳しくは、CSS @scope at-rule でセレクタのリーチを制限するをご覧ください。

対応ブラウザ

  • 118
  • 118
  • x
  • 17.4

CSS では、Reduced-transparency が優先される

Chrome 118 には prefers-reduced-transparency メディア機能が含まれています。これは、ユーザーがデバイスで設定した設定を確認し、コードでユーザーのニーズを満たすことができる一連の機能の 1 つです。この機能について詳しくは、CSSprefers-reduced-transparency をご覧ください。

対応ブラウザ

  • 118
  • 118
  • x

ソース

CSS 相対色の構文

Chrome 119 は、CSS Color 5 の相対色構文の強力な新機能です。これにより、必要な色空間や構文を使用して、別の色から色を導出できます。

WebAssembly ガベージ コレクション(WasmGC)

Chrome 119 には WasmGC が含まれており、WebAssembly で Kotlin、PHP、Java などのガベージ コレクション型言語の処理が高速化されます。詳しくは、Chrome でデフォルトで有効になった WebAssembly ガベージ コレクション(WasmGC)をご覧ください。

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

ベータ版ブラウザのバージョンでは、ブラウザの次の安定版でリリースされる機能をプレビューできます。この機会に、一般公開に先駆けて、サイトに影響する可能性がある新機能や削除についてテストすることをおすすめします。新しいベータ版は Firefox 120Safari 17.2 です。これらのリリースは、プラットフォームに多くの優れた機能をもたらします。詳しくはリリースノートをご覧ください以下に、その一部をご紹介します。

Safari 17.2 には、多くの新機能が含まれています。CSS については、CSS Custom Highlight API、mask-border プロパティ、counter-set プロパティなど、多くの機能がサポートされています。さらに、相互運用性を改善するために、既存の機能に多くの修正が加えられています。

HTML については、Safari 17.2 では <details> 要素の name 属性がサポートされています。また、ウェブ API では、<link rel=preload> で優先度フェッチとレスポンシブ画像のサポートが有効になりました。

Firefox 120 では、CSS の rh ユニットと rlh ユニット、text-wrap: balancelight-dark() 関数のサポートが追加されています。

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