デジタルマーケティングTips
Chrome 125 仕様変更発表まとめ
Google Chrome 125の主要な仕様変更発表のまとめです。(ベータ版時点での情報です)
要点
- 追加・拡張：
以下の機能が追加・拡張され、表現力・利便性が向上します
ツールチップ表示や端数処理等の機能強化でCSSの表現力が向上する
FedCM(ID認証連携)の利便性が向上する 等
- 仕様変更：
以下の仕様が変更されます
これを使用している場合は設定の移行等が必要になります
スクロールバー表示やテキスト選択の処理が変更される 等 - 廃止・削除：
以下の機能が使用できなくなります
これを使用している場合は設定の移行等が必要になります
ベースURL継承許可や全画面表示の旧称対応が廃止される 等
メルマガでも情報を配信中です！ ぜひご登録ください。
追加・拡張
CSS：ツールチップ表示対応
- CSS Anchor Positioning API
…特定要素に付随させて別要素を挿入表示するためのCSSプロパティ等が使えるようになります。
活用できると、ボタン・入力要素・専門用語等に対してツールチップ・補足説明等を挿入表示する際に、JavaScriptを使わなくてもCSSだけでの実装が可能になります。
大まかな流れとしては以下の通りです。- アンカー(元々の表示要素)となる要素のIDもしくはクラスに対して、anchor-nameプロパティを使い、挿入表示対象を指定
- position-anchorプロパティとanchor()関数で、追加表示の位置やデフォルトを指定
- inset-areaプロパティで、挿入先領域のどちら寄りに追加要素を配置するか指定
CSS：端数処理・整数除算用関数の追加
- round()関数…各種数値(長さや時間等単位付きも可)に対して、任意の処理単位での端数処理(丸め)を行う関数です。()内に処理条件・対象となる値・処理単位を引数として入れると、処理後の値を返します。
処理条件は以下から選択できます。省略時はnearestがデフォルト値として扱われます。- up…多い方の処理単位に寄せる
- down…少ない方の処理単位に寄せる
- nearest…対象値から近い方の処理単位に寄せる
- to-zero…0に近い方の処理単位に寄せる
- mod()関数…()内に被除数・除数を引数として入れると、除算結果の整数部分を返します。
負の数を含む除算結果の正負は、被除数の正負によらず、除数側の正負が反映されます。 - rem()関数…()内に被除数・除数を引数として入れると、除算の剰余(余り)を返します。
負の数を含む除算結果の正負は、除数の正負によらず、被除数側の正負が反映されます。
HTML：Shadow DOM関連の利便性向上
- Declarative Shadow DOMについて、シャドウルートを持つDOMツリーをシリアル化(バイト列変換)できるようになります。
Web API：広告効果測定関連の強化
- Attribution Reporting APIの機能追加…デバッグ関連機能として、登録失敗時の解析レポートを出力する機能が追加されます。
メリットとしては以下が挙げられます。- 登録プラットフォーム内の入力フィールドの好き嫌いを特定可能にし、人間工学的な改善に繋げられる
- プライバシー保護が強化される
- Storage Access API※について、パーティション化(ドメイン別隔離)されていないCookieや、Cookie以外の端末ストレージについても、サードパーティコンテキスト(別ドメイン環境)からのアクセスが許可されるようになります。
- Shared Storage APIを使ってクロスオリジン(別ドメイン)のワークレットで処理を行う際に、iframeを作成しなくてもワークレットを動作させられるようになります。
- Compute Pressure API…端末のCPU負荷状態を取得できるAPIが使えるようになります。Webシステム/コンテンツが高負荷になってブラウザの異常終了リスクが高まった場合に、負荷を下げた処理に切り替える等の対策が可能になります。
- WebSocketコンストラクタについて、http://～およびhttps://～のスキームが使用できるようになります。
これに伴い、相対URLでの表記も可能になります。この場合URLはws://～もしくはwss://のスキームとして正規化されます。 - Direct Sockets API…Chrome AppsからIsolated Web Appsへの移行の一環として、ブラウザから直接TCP・UDPによる通信・データ送受信を可能にするAPIが使用できるようになります。
Web API：サードパーティCookie後継技術関連の強化
※Storage Access API…従来のサードパーティCookieの代替/後継技術の一種で、別ドメイン由来の埋め込みコンテンツ等からでも端末内ストレージを読み書き可能にするAPI
※参照：Storage Access API
https://developer.mozilla.org/ja/docs/Web/API/Storage_Access_API
Storage Access API
https://developers.google.com/privacy-sandbox/3pcd/storage-access-api?hl=ja
Storage Access API を介した Cookie 以外のストレージ アクセスのオリジン トライアルに参加する
https://developers.google.com/privacy-sandbox/blog/saa-non-cookie-storage?hl=ja
Web API：その他Webアプリ/システム開発技術関連の強化
オリジントライアル(先行試験実装)
FedCM(ID認証連携)関連の強化
- FedCM Button Mode API…FedCM認証に対応したログイン先サイト側(RP)を表示したときに、ID認証を勧めてくるダイアログとボタンを自動表示する「ボタンモード」が使えるようになります。
- Use Other Account API…FedCMでの認証処理時、IdP(認証提供)側から、[ほかのアカウントでログインする]選択肢を提供できるようになります。
画面折りたたみデバイス対応強化
- Foldable API…画面を折りたためるデバイス向けに、折りたたみの有無の状態に応じた表示切り替えを可能にするAPIが追加されます。左右分割の2画面に異なるコンテンツを表示したり、上下分割の上側にコンテンツ・下にUI等で表示の使い分けを行ったりすることが可能です。
以下の2種類のAPIで構成されています。- Device Posture API…折りたたみ状態に関するメディア特性・CSS条件分岐等が使えるようになります。
- Viewport Segments Enumeration API…折りたたみ状態に応じて画面を指定サイズでの複数領域に分割し、多画面Webシステム/コンテンツとして扱えるようになります。
- Device Posture API
- プリロードスキャナ(表示未反映の情報の先読み・解析を行う機能)がパフォーマンス的に逆効果な動きをする場合、プリロードスキャン動作をスキップできるようにする機能が実装されます。
サブリソースが少ないページ等、投機的先読みをしてもメリットが希薄で処理だけが増える場合に有効です。
ページ解析・先読み処理の選択肢追加
※オリジントライアルは、サイト管理者がオリジントライアル管理画面から対象オリジン(ドメイン)を登録し、発行されたトークンをHTMLにmetaタグとして設置した場合のみ、期間限定で有効になります。(詳細はGoogleの解説を参照)
修正・改善
一部カラーモードでの表示改善
- Lab・LCH・Oklab・Oklchでの色指定について、明度100%で完全な白、明度0で完全な黒で色が置き換えられていた処理がなくなり、ほかのパラメーターを考慮した計算処理結果での色が適用されるようになります。グラデーション処理で色が一部不自然に真っ白・真っ黒に変わる状態が解消されます。
仕様変更
スクロールバーのカラースキーム変更
- スクロールバー表示のカラースキーム(ライト/ダーク)について、ページ全体の設定とルート要素のcolor-schemeプロパティがいずれも「normal」もしくは無指定であった場合、ユーザーの設定(ライト/ダーク)がスクロールバーの表示にも反映されるようになります。
ルート要素のcolor-schemeプロパティにlightやdarkのカラースキーム指定がある場合は、コンテンツ側の指定がスクロールバーのデフォルト表示色に反映されます。
Tabキー移動対象追加(アクセシビリティ対応関連)
- Tabキーでのフォーカス移動対象にスクロールコンテナが追加される仕様変更(124から順次反映)が、125リリース時に完了します。
FedCMにセキュリティ要件追加
- FedCM APIで、IdP(ID認証提供)側のサーバーに、クロスオリジンリソース共有(CORS)対応要件が追加されます。
IdP側はRP(ログイン先)からのリクエストでサイト間のID認証・ログイン機能連携を行う場合に、レスポンスヘッダー設定でCORSの要件を満たす必要があります。
マウス移動時のテキスト選択処理変更
- mousemoveイベント発生時(要素からマウスカーソルが移動するとき)の動作が変更になり、他の主要ブラウザと同じになります。
- 変更前：デフォルトはテキスト選択を実行、ただしmousemoveイベントをキャンセルすると選択を破棄できる
↓ - 変更後：mousemoveイベントのデフォルトアクションからテキスト選択が外れる
- 変更前：デフォルトはテキスト選択を実行、ただしmousemoveイベントをキャンセルすると選択を破棄できる
リバースオリジントライアル(仕様変更猶予) / デプリケーショントライアル(廃止猶予)
カメラ/マイクプレビュー適用の延期
- 今後ChromeではWebサイトが端末のカメラ・マイクへのアクセス権を要求したときに、リアルタイムプレビューを表示する仕様変更が行われます。この仕様変更に起因する問題への対応が間に合わない場合、リバースオリジントライアルにドメインを登録すると、仕様変更の適用を延期できるようになります。
動画全画面表示用の旧API廃止猶予
- 動画全画面表示用のAPIで「webkit～」がついていたプロパティおよびメソッド(Chrome 38で非推奨化)について、Chrome 125で対応が完全に削除されます。 後継機能へ置き換える改修(後述)が間に合わない場合は、デプリケーショントライアルにドメインを登録すると、該当機能をChrome 131(2025年2月12日ごろ)まで維持できます。
※リバースオリジントライアル/デプリケーショントライアルは、サイト管理者がオリジントライアル管理画面から対象オリジン(ドメイン)を登録し、発行されたトークンをHTMLにmetaタグとして設置した場合のみ、期間限定で有効になります。(詳細はGoogleの解説を参照)
廃止・削除
複数窓処理権限の旧称廃止
- Window Management API(旧称Multi-Screen Window Placement API、マルチウィンドウWebシステム制御用のAPI)を使う際に必要な「window-management」権限について、旧称「window-placement」を別名として残す移行期間が終了し、旧称への対応が全廃されます。
コード内に「window-placement」が残っている場合は、「window-management」への移行を済ませる必要があります。
ベースURL継承許可廃止
- NewBaseUrlInheritanceBehaviorAllowedポリシー(ベースURLの継承に使用されるポリシー設定)への対応が廃止されます。従来はこのポリシーがあればNewBaseUrlInheritanceBehavior (iframe等の埋め込み文書に対するベースURLの継承)が有効化できましたが、今後はできなくなります。
動画等全画面表示の旧プロパティ・メソッド廃止
- 動画等をFullscreen APIで全画面表示する場合、「webkit～」で始まる旧形式のプロパティ・メソッドが、Chrome 125で完全に削除されます。(Chrome 38時点で既に非推奨化されています)
- webkitSupportsFullscreen
- webkitDisplayingFullscreen
- webkitEnterFullscreen()
- webkitExitFullscreen()
- webkitEnterFullScreen()
- webkitExitFullScreen()
メソッドへの置き換えが必要です。
※参照：Chrome 125 beta - Chrome for Developers (2024/04/17)
https://developer.chrome.com/blog/chrome-125-beta
マックスマウスからのお知らせ
Web制作・マーケティング担当者向けのお役立ち情報をメールマガジンでお届け！
WebサイトやSNSでの情報発信の安定化・効率化、CMS導入・運用、脆弱性対策、Flashコンテンツ置き換え、Webプロモーションなどなど、Web制作・マーケティング関係者向けの課題解決に役立つ、便利なサービス情報や活用法などをご案内します。
いますぐご登録ください！
