Google Chrome 117が安定版に
エグゼクティブ・フェロー 木達検品に用いている主要ブラウザのアップデートについてお知らせします。
Google Chrome 117が安定版になり、デスクトップ版ChromeでWindows向けには117.0.5938.62/.63、macOSとLinux向けには117.0.5938.62がリリースされました(Chrome Releases: Stable Channel Update for Desktop)。
CSSアニメーションに関連する3つの新機能が、フロントエンド周りで本バージョン注目のポイントでしょうか。それらはいずれも、先だってFour new CSS features for smooth entry and exit animations - Chrome Developersのなかで紹介されていたものです。
第一に、transition-behavior
プロパティ。その値にallow-discrete
を指定することで、補間可能なプロパティに加え、display
のような離散的なプロパティにおいてもトランジションが可能になります。ショートハンド記法でtransition
プロパティを使用している場合、同じ宣言ブロック内でそれより後ろに書く必要がある点は、注意が必要です。仕様はCSS Transitions Level 2の2.5. The transition-behavior Propertyで確認できます。
第二に、@starting-style
規則。これは、要素がページ上で表示されるより前にブラウザが参照するためのスタイルを適用します。仕様はCSS Transitions Level 2の3.3. Defining before-change style: the @starting-style ruleで確認できます。
第三に、トップレイヤーにおける表示を制御するoverlay
プロパティ。仕様はCSS Positioned Layout Module Level 4の3.4. Controlling the Top Layer: the overlay propertyで確認できます。仕様にあるとおり、このプロパティは基本的にユーザーエージェントによって設定されますが、トップレイヤーに要素を表示/非表示させる際のアニメーションをカスタマイズする際に制作者が活用できます。
また、2023年8月のWebプラットフォームの新機能で触れていたとおり、grid-template-columns
とgrid-template-rows
の値にsubgrid
がサポートされ、主要なブラウザで一律にサブグリッドが活用できるようになった点も、要注目です。仕様についてはCSS Grid Layout Module Level 2を、また解説についてはサブグリッド - CSS: カスケーディングスタイルシート | MDNを参照ください。
このアップデートにはほかにも数多くの修正(セキュリティに関する修正については16件)と改良が含まれています。開発者向けの情報はNew in Chrome 117 - Chrome Developersにまとまっています。特に、新たに追加されたDevToolsの機能については、What's New in DevTools (Chrome 117) - Chrome Developersにまとめられています。
次のメジャーバージョン、Chrome 118のリリースは、Chromium Dashによると2023年10月10日の予定のようです。