Chrome 125

穩定版:2024 年 5 月 14 日

除非另有說明,否則以下變更會套用至 Android、ChromeOS、Linux、macOS 和 Windows 適用的 Chrome 125 穩定版。

HTML 和 DOM

宣告式陰影 DOM 序列化

這項功能可讓開發人員序列化內含陰影根的 DOM 樹狀結構,且經過 HTML 標準最近標準化處理。

追蹤錯誤 #41490936 | ChromeStatus.com 項目 | 規格

CSS

CSS 錨定位置

CSS 錨定定位可讓開發人員「網路」以宣告方式將絕對位置元素放置在頁面上的一或多個元素 (「錨定標記」),而不必使用 JavaScript。錨點可捲動時,錨點定位的運作成效顯著。常見的用途是在叫用彈出式視窗的元素旁邊顯示工具提示,或是特定選單及其彈出式選項清單。在錨定定位功能推出之前,這些用途需要使用 JavaScript 以動態方式定位彈出式視窗,並在叫用叫用元素時將其錨定在捲動位置,這是一種效能導向目標,難以正確執行。使用錨點定位時,能以宣告方式有效地實作這些用途。

錨定定位功能包含大量 CSS 屬性。以下是幾個主要屬性:

  • anchor-name:將元素設為其他元素的錨定元素。
  • position-anchor:說明錨定元素應用於錨定位置的「預設」錨點。
  • anchor() 函式:用於參照錨定元素的位置,指定錨定元素的位置。
  • inset-area:用於定位的簡寫,用於一般相對位置。

CSS 錨定定位 API 簡介 | 追蹤錯誤 #40059176 | ChromeStatus.com 項目 | 規格

CSS 逐步值函式:round()mod()rem()

分階值函式 (round()mod()rem()) 都會根據另一個「步驟值」轉換指定值。

round() CSS 函式會根據所選的捨入策略傳回四捨五入的數字。

mod() CSS 函式會在第一個參數除以第二個參數 (%) 時,傳回剩餘的模數,類似於 JavaScript 餘數運算子 (%)。它一律會拿除程序的正負號。

rem() CSS 函式會在第一個參數除以第二個參數時傳回剩餘的餘數,這點與 JavaScript 餘數運算子 (%) 類似。餘數是當運算元 (除數) 除以第二個運算元時的剩餘值,再除以第二個運算元 (除數)。它一律會取得分隔線的正負號。

追蹤錯誤 #40253179 | ChromeStatus.com 項目 | 規格

CSS 自訂 :state() 的新語法

CSS 自訂狀態可讓自訂元素公開自己的虛擬類別。CSSWG 現已規定語法,Chrome 125 現在支援新的語法 :state(foo)。這項變更會在一個視窗中同時支援舊語法 (:--foo) 和新語法,方便網站切換至新語法。

ChromeStatus.com 項目 | 規格

移除 Oklab 和丹麥顏色的中斷功能,亮度將近 100% 或 0

在這項變更之前,無論另外兩個參數為何,亮度值為 100% 的所有 Lab、LCH、Oklab 和 Oklch 顏色均顯示為白色。這些空間的所有亮度值為 0 都會以黑色呈現。這兩個對應導致漸層出現中斷,網頁開發人員也沒想到這一點。

在這個復原作業中,這些顏色不再以人為方式對應,因此顯示的顏色將會與鄰近顏色保持一致,並取決於螢幕的色域對應。

ChromeStatus.com 項目 | 規格

使用色彩配置根捲軸

如果「網頁支援的色彩配置」的值為「一般」或未指定,且根元素的 color-scheme 運算值為 normal,則瀏覽器一律使用使用者偏好的色彩配置算繪可視區域捲軸。可視區域捲軸可視為網頁內容外。因此,如果開發人員未明確指定支援色彩配置,則使用者代理程式在算繪可視區域捲軸時,應遵循使用者偏好的色彩配置。

這項變更不會阻止開發人員控管捲軸的色彩配置。只有在開發人員未指定根元素的色彩配置時,新行為會讓瀏覽器根據使用者偏好的色彩配置,算繪可視區域的非疊加層捲軸。

title | 追蹤錯誤 #40259909 | ChromeStatus.com 項目 | 規格

view-transitions 類別

我們提供新的 CSS 屬性 view-transition-class,可讓您指定一或多個檢視畫面轉換類別。接著,您可以使用這些類別選取 ViewTransition 虛擬元素,例如 ::view-transition-group(*.class)

這是 ViewTransition API 的擴充功能,用於簡化檢視畫面轉換虛擬元素的樣式,且 CSS 類別簡化一般 DOM 元素的樣式。

追蹤錯誤 #41492972 | ChromeStatus.com 項目 | 規格

載入中

建構 WebSocket 時接受 HTTP 和 HTTPS 網址

這項更新會在 WebSocket 建構函式中啟用 HTTP 和 HTTPS 配置,因此開發人員也能使用相對網址。這類網址會經過正規化為 ws:wss: 內部配置。

追蹤錯誤 #325979102 | ChromeStatus.com 項目 | 規格

網站 API

Attribution Reporting API 新增項目

為 Attribution Reporting API 新增功能,可支援剖析失敗偵錯報表,藉此建立其他偵錯功能、支援指定偏好的註冊平台,並改善 API 人體工學。

ChromeStatus.com 項目

Compute 壓力 API

Compute Pressure API 可以提供代表系統 CPU 負載的高階狀態。藉由允許實作使用正確的基礎硬體指標,確保在系統不易管理的壓力下,使用者也能充分運用可用的所有處理能力。

Intel 主導了這個 API 的設計和實作工作,讓視訊會議應用程式能在功能與效能之間動態平衡。

Compute Pressure API | 追蹤錯誤 #40683064 | ChromeStatus.com 項目 | 規格

這樣做會啟動 Storage Access API 提議的擴充功能 (回溯相容且已處於來源試用階段),以便在第三方環境中存取未分區的 Cookie 和非 Cookie 儲存空間。目前的 API 只會提供 Cookie 存取權,用途與非 Cookie 儲存空間不同。

追蹤錯誤 #40282415 | ChromeStatus.com 項目 | 規格

針對 ID 斷言端點的 FedCM CORS 要求

FedCM API 中的擷取作業因為具有必要屬性而難以理解。雖然有關於帳戶端點的持續討論,但在大部分的情況下也都認同 ID 斷言端點應使用 CORS。這項更新可讓這項擷取作業的安全屬性與網路平台中的其他擷取作業更吻合。

FedCM 更新:Button Mode API 來源試用、CORS 和 SameSite | 追蹤錯誤 #40284123 | ChromeStatus.com 項目

FedCM 現在會透過 CORS 傳送 ID 斷言要求。這項變更表示 Chrome 不會再將 SameSite=Strict Cookie 傳送至 ID 宣告端點,但 Chrome 仍會傳送 SameSite=None。將不同的 Cookie 組合傳送至帳戶端點和 ID 斷言端點並不合理,因此這項變更會讓 Cookie 保持一致。

不傳送 SameSite=Strict Cookie 也與 requestStorageAccess 行為和跨網站要求大致相同。

追蹤錯誤 #329145816 | ChromeStatus.com 項目 | 規格

可互通的滑鼠移動預設動作

Chrome 允許取消滑鼠移動事件,以免發生文字選取 (甚至是過去拖曳) 等其他 API。這不會與其他主要瀏覽器相符;也不符合 UI 事件規格。現在,文字選取功能將不再是滑鼠移動的預設動作。但透過分別取消 selectstartdragstart 事件仍可避免文字選取和拖曳。

這項功能將從 Chrome 125 版開始逐步推出,預計在 Chrome 126 上開放所有使用者使用。

示範 | 追蹤錯誤 #40078978 | ChromeStatus.com 項目 | 規格

規則運算式修飾符

規則運算式修飾符新增功能,可在本機修改模式內的 ims 旗標。

如要啟用子運算式的標記,請使用 (?X:subexpr),其中 Xims 的其中之一。如要停用子運算式的標記,請使用 (-X:subexpr)

舉例來說,如果是區分大小寫的 i 標記:

const re1 = /^[a-z](?-i:[a-z])$/i;
re1.test("ab"); // true
re1.test("Ab"); // true
re1.test("aB"); // false

const re2 = /^(?i:[a-z])[a-z]$/;
re2.test("ab"); // true
re2.test("Ab"); // true
re2.test("aB"); // false

ChromeStatus.com 項目 | 規格

規則運算式重複的已命名擷取群組

複製已命名的擷取群組,可讓您在各種替代項目中使用相同的擷取群組名稱。範例說明

const re = /(?<year>[0-9]{4})-[0-9]{2}|[0-9]{2}-(?<year>[0-9]{4})/;

在這種情況下,year 對第 1 個替代字詞 ((?<year>[0-9]{4})-[0-9]{2}) 或第 2 個替代字詞 ([0-9]{2}-(?<year>[0-9]{4})) 有效。

ChromeStatus.com 項目 | 規格

Chrome 應用程式

Chrome 應用程式中的 Direct Sockets API

本次更新能在 Chrome 應用程式中啟用直接通訊端,讓網頁應用程式建立與網路裝置和系統的直接傳輸控制通訊協定 (TCP) 和使用者資料語法通訊協定 (UDP) 通訊,協助順利從 Chrome 應用程式轉換至獨立網頁應用程式。

ChromeStatus.com 項目 | 規格

新來源試用

FedCM 按鈕模式 API 和使用其他 Account API

這項來源試用包含以下兩個 FedCM API。

Button Mode API 可讓網站在點選按鈕 (例如點選 [登入 IdP] 按鈕) 時呼叫 FedCM。這需要 FedCM 來確保其回應一律會顯示可見的使用者介面,而非小工具模式,而小工具模式不會在使用者登出時顯示 UI。在按鈕模式中呼叫 FedCM API 時,系統會在使用者登出時登入 IdP。

此外,由於系統會在使用者明確手勢中呼叫按鈕模式,因此與使用小工具模式的 UI (沒有這類明確意圖) 相比,UI 也可能更顯眼 (例如置中和強制回應)。如要進一步瞭解 Button Mode API 的運作方式,請參閱「FedCM 更新:Button Mode API 來源試用、CORS 和 SameSite

識別資訊提供者可讓使用者登入其他帳戶。

來源試用 | 示範 | 追蹤錯誤 #40284792 | ChromeStatus.com 項目 | 規格

折疊式 API

此來源試用包含 Device Posture API 和 ViewportSegment Enumeration API。這些 API 旨在協助開發人員鎖定折疊式裝置。

來源試用 | 折疊式 API 的來源試用 | ChromeStatus.com 項目 | 規格

淘汰試用前置字串的 HTMLVideoElement 全螢幕屬性和方法

此淘汰試用計畫可讓您有更多時間調整程式碼,改回支援前置字串的 HTMLVideoElement 屬性和方法。

來源試用 | ChromeStatus.com 項目

略過預先載入掃描程序

略過預先載入掃描器,針對沒有擷取子資源擷取的網頁查看效能取捨。

預先載入掃描器步驟可透過實作推測性預先擷取功能,對含有子資源擷取的網頁提高效能。不過,對於不適合此步驟的網頁,也就是對於沒有子資源的網頁,這會產生額外的處理負擔,而且幾乎不會帶來任何好處。

對於想要減少這類負擔的進階網路使用者而言,這項實驗提供了頁面層級控制項,方便您停用預先載入掃描器。從這項實驗收集到的資料可以評估,確認修改後的 API 或 HTML 預先載入掃描器的其他實作方式是否有幫助。

來源試用 | 追蹤錯誤 #330802493 | ChromeStatus.com 項目 | 規格

淘汰和移除

移除權限和權限政策「window-management」的「window-placement」別名

移除權限和權限政策「window-management」的「window-placement」別名。這個步驟是為了藉由淘汰並移除「window-placement」移除,重新命名字串。Window Management API 會隨時間不斷演進,而術語變更則可改善描述元的持續性。

title | 追蹤錯誤 #40842072 | ChromeStatus.com 項目 | 規格

移除企業政策:NewBaseUrlInheritanceBehaviorAllowed

自 2023 年 8 月 (Chrome 118) 起,這項企業政策覆寫功能已在穩定版中啟用基礎程式碼變更 (啟用新的基本網址沿用行為)。由於已解決已知的問題,這項企業政策已在 Chrome 125 版中移除。

ChromeStatus.com 項目

移除前置字元的 HTMLVideoElement 全螢幕屬性和方法

前置字串的 HTMLVideoElement 全螢幕 API 已於 Chrome 38 版淘汰,並由 Element.requestFullscreen() 取代,後者首度在 Chrome 71 版中自 2018 年推出。

下列屬性和方法將從 HTMLVideoElement 中移除:

  • webkitSupportsFullscreen
  • webkitDisplayingFullscreen
  • webkitEnterFullscreen()
  • webkitExitFullscreen()
  • webkitEnterFullScreen() (請注意 FullScreen 中「S」的大小寫不同)
  • webkitExitFullScreen()

如果您的網站仍然需要使用以上文章,而您需要更多時間更新程式碼,請註冊本文中列出的淘汰試用計畫

ChromeStatus.com 項目

其他資訊

想閱讀更多內容嗎?歡迎參考下列其他資源。

下載 Google Chrome

下載 Chrome Android電腦版iOS 版。