Chrome 149 の新機能

Rachel Andrew

公開日: 2026 年 6 月 2 日

Chrome 149 がリリースされました。この投稿では、今回のリリースにおける主な機能の一部をご紹介します。Chrome 149 のリリースノート全文をご覧ください。

このリリースのハイライトは次のとおりです。

  • CSS ギャップ装飾を使用すると、グリッドや Flexbox などのコンテナ レイアウトのギャップのスタイルを設定できます。
  • bfcache エントリで WebSocket を切断すると、アクティブな WebSocket 接続があるページがバックフォワード キャッシュに保存されます。
  • Intl.Locale.prototype.variants は、ロケールのバリアントを返します。また、ロケールのバリアントを設定します。

CSS ギャップ装飾

CSS ギャップ装飾を使用すると、グリッドや flexbox などのコンテナ レイアウトのギャップをスタイル設定できます。これにより、以前は複雑な境界線や疑似要素のハックが必要だった一貫性と新しいスタイル設定オプションが実現します。この機能はプログレッシブ エンハンスメントに対応しています。サポートされていないブラウザでは、ギャップは装飾なしで通常どおりにレンダリングされます。

column-rule-inset や row-rule-inset などのプロパティを導入して装飾を縮小または拡張したり、column-rule-visibility-items や row-rule-visibility-items を使用して隣接するアイテム間またはすべてのギャップにのみルールを表示したりできます。ルールの幅、色、インセットは完全にアニメーション化できるため、ホバー時やその他の状態変化時にトランジションを適用できます。

詳しくは、CSS ギャップ装飾の安定版に関する投稿をご覧ください。

bfcache エントリで WebSocket を切断

アクティブな WebSocket 接続があっても、ページがバックフォワード キャッシュ（bfcache）に保存されるのを妨げることはなくなりました。ドキュメントを不適格としてマークする代わりに、BFCache エントリで WebSocket 接続を事前に閉じることで、ブラウザはアクティブな WebSocket を使用するページをメモリに保存し、瞬時に復元できるようになりました。

以前は、アクティブな WebSocket 接続があると、ユーザーがページから移動したときにブラウザがページを破棄し、バックフォワード キャッシュ（bfcache）に保存されませんでした。

Intl.Locale.prototype.variants

Intl.Locale オブジェクトは、Unicode ロケール識別子を表します。メイン オブジェクトは Baseline Widely available です。

バリエーションはメイン言語識別子の一部であり、(言語、地域、スクリプト) の 3 つ組で区別できない言語のバリエーションを選択します。この機能は Firefox と Safari ではすでにリリースされており、Chrome でも利用できるようになりました。

次に例を示します。

const locale = new Intl.Locale("sl-rozaj-biske");
console.log(locale.variants); // "rozaj-biske"

詳しくは、Intl.Locale.prototype.variants の MDN ドキュメントをご覧ください。

関連情報

ここでは、主なハイライトの一部のみを取り上げます。Chrome 149 のその他の変更については、以下のリンクをご覧ください。

登録

最新情報を入手するには、Chrome Developers YouTube チャンネルに登録してください。新しい動画が公開されるたびにメール通知が届きます。また、X または LinkedIn でフォローして、新しい記事やブログ投稿を入手することもできます。

Chrome 150 がリリースされ次第、Chrome の新機能についてお知らせします。