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

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

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

Firefox 119 には、Object.groupBy および Map.groupBy 静的メソッドを使用した JavaScript 配列のグループ化があります。

対応ブラウザ

  • 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 @scopeat-rule でセレクタの範囲を制限するをご覧ください。

対応ブラウザ

  • 118
  • 118
  • x
  • 17.4

ソース

CSS Preferreds-reduced-transparency

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

対応ブラウザ

  • 118
  • 118
  • x

ソース

CSS 相対色の構文

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

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

Chrome 119 には、WebAssembly で Kotlin、PHP、Java などのガベージ コレクション言語の処理を高速化する WasmGC が含まれています。詳しくは、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 の rhrlh のユニット、text-wrap: balancelight-dark() 関数のサポートが追加されています。

ウェブの最新情報シリーズの一部