Chrome 121の新機能と開発者向け改善点、CSS更新とAPI進化を解説

• Chrome 121ではCSSの更新、Speculation Rules APIの改善が実施
• Element Capture APIのオリジントライアルが開始、特定HTML要素のキャプチャが可能に
• スクロールバーやフォントパレットのカスタマイズ、動画会議アプリでの利用に注目

Chrome 121ではCSSの更新が行われ、スクロールバーの色と幅をカスタマイズできるようになった。^[1]

フォントパレットプロパティがアニメーションをサポートし、色付きフォントのパレット間のスムーズな切り替えが可能に。

新たに追加された「::spelling-error」と「::grammar-error」の疑似要素によって、スペルや文法のエラーをカスタマイズできるようになり、より統合された外観でのカスタムスペルチェックが実現された。

また、supports()句を使用することで、サポート条件に基づいたスタイルシートやレイヤーをインポートできるようになり、サポート条件が一致しない場合はインポートされない。

SVGのCSSマスキングが改善され、Chrome 120で導入されたCSSマスクサポートのフォローアップとして、SVGに新たなマスクサポートも追加されているようだ。

Speculation Rules APIはChromeにプリレンダリングすべきページをプログラム的に指示することで、ページナビゲーション時間を短縮しユーザーエクスペリエンスを向上させる。

このAPIにはブラウザがページ内の要素から推測的ローディングのためのURLリストを取得するため、ドキュメントルールが新たにサポートされた。

Element Capture APIはオリジントライアルで利用可能となり、特定のHTML要素をキャプチャして記録することができるように。

このAPIはビデオ会議アプリでサードパーティのアプリケーションをiframeに埋め込む際に、そのiframeをビデオとしてキャプチャしリモート参加者に送信する場合などに有用である。

また、Speculation Rules APIでは、Speculation-Rules HTTPレスポンスヘッダーを使用して推測ルールを指定することも可能になった。

Chrome 121のアップデートは、開発者にとって多くの新しい可能性をもたらすものだ。

特にCSSの更新やAPIの改善は、ウェブアプリケーションのユーザーインターフェイスとパフォーマンスの向上に大きく寄与するだろう。

今後のChromeのバージョンアップでは、これらの新機能を活用した革新的なウェブアプリケーションの登場が期待される。

References

1. ^ Chrome for Developers. 「New in Chrome 121 | Blog | Chrome for Developers」. https://developer.chrome.com/blog/new-in-chrome-121?hl=en, (参照 24-01-25).

※上記コンテンツの内容やソースコードはAIで確認・デバッグしておりますが、間違いやエラー、脆弱性などがある場合は、コメントよりご報告いただけますと幸いです。

ITやプログラミングに関するコラム

• 
  DX人材を社内育成する重要性とは？外部委託との違いや具体的な教育方法も併せて解説。
• 
  【DXコンサルティングの実態調査】契約中と契約解除の企業でコミュニケーション量に4倍の差。
• 
  【無料・登録不要】PyWebにWebアプリ実行機能が追加されたので使ってみた。
• 
  DXのわかりやすい例題と企業がDXに成功した事例を紹介
• 
  新入社員研修の日報活用法とは？自己成長とコミュニケーション強化の重要性

ITやプログラミングに関するニュース

• 
  Google Chromeが新AI機能を導入、タブ整理とテーマ生成を効率化
• 
  Windows 11最新アップデート、機能改善と解決した問題について
• 
  Firefox 122.0リリース、検索提案と翻訳機能の大幅改善
• 
  Ms.Engineer株式会社、リスキリングコンソーシアム参画で女性エンジニア育成を加速
• 
  開発ツール専門レビューサイト「Findy Tools」がリリース、新たな開発ツール選定の指針となるか