Chrome 123 Beta 版

除非另有說明,否則下列變更適用於 Android、ChromeOS、Linux、macOS 和 Windows 的最新 Chrome 公開測試版頻道版本。如要進一步瞭解這裡列出的功能,請點選提供的連結,或參閱 ChromeStatus.com 的清單。截至 2024 年 2 月 21 日,Chrome 123 為 Beta 版。你可以前往 Google.com 的電腦版或 Android 版 Google Play 商店下載最新版。

CSS

此版本新增了五項 CSS 功能。

CSS light-dark() 顏色函式

CSS 中的 light-dark() 函式可讓開發人員更輕鬆地根據使用者偏好,將色彩配置調整為淺色或深色模式。

使用 light-dark() 可在單一 CSS 屬性中指定兩個不同的顏色值。瀏覽器 (或裝置) 會根據元素計算的 color-scheme 值,自動選擇適當的顏色。例如,使用下列 CSS:

  • 如果使用者選取淺色主題,.target 元素就會顯示檸檬綠背景。
  • 如果使用者選取深色主題,.target 元素的背景會是綠色。
html {
  color-scheme: light dark;
}
.target {
    background-color: light-dark(lime, green);
}

CSS 子母畫面顯示模式

picture-in-picture 值新增 CSS display-mode 媒體功能支援。這可讓網頁開發人員編寫特定 CSS 規則,這些規則只會在子母畫面模式中顯示 (部分) 網頁應用程式時套用。

如要進一步瞭解這項媒體功能,請參閱子母畫面說明文件

區塊的 align-content CSS 屬性

系統現在支援在區塊容器和表格儲存格中使用 align-content CSS 屬性。先前,這項屬性僅支援格狀和 Flex 項目。例如,display: blockdisplay: list-itemdisplay: table-cell 現在可以使用 align-content 對齊。

詳情請參閱「在區塊和表格版面配置中支援 align-content」。

field-sizing CSS 屬性

開發人員可以使用 field-sizing 屬性,停用表單控制項的固定預設大小,並讓大小取決於內容。這可讓您建立自動延伸的文字欄位。

CSS text-spacing-trim 屬性

這個屬性會將字距套用至中文、日文和韓文 (CJK) 標點符號,以產生 JLREQ (日文文字版面配置需求) 和 CLREQ (中文文字版面配置需求) 定義的視覺悅目排版。

許多 CJK 標點符號都包含字形內部間距。舉例來說,CJK 句號和 CJK 右括號通常會在字形空格的右半部加上字形內部間距,以便讓這些字元與其他表意文字字元保持一致。但如果這些字元排成一列,內部字元間距就會過大。這項功能會調整過大的間距。

text-spacing-trim 屬性可接受下列四個值之一:normaltrim-startspace-allspace-first。如要進一步瞭解,請參閱「CSS 推出四項全新國際功能」。

網站 API

允許在跨來源 iframe 中建立 WebAuthn 憑證

這項功能可讓網頁開發人員在跨來源 iframe 中建立 WebAuthn 憑證 (也就是「publickey」憑證,又稱為密碼金鑰)。這項新功能需要符合兩個條件:

  • iframe 具有 publickey-credentials-create-feature 權限政策。
  • iframe 有暫時性的使用者啟用。

這可讓開發人員在嵌入式情境中建立密碼金鑰,例如在依賴方提供聯合式身分體驗的身份提升流程後。

歸因報表功能組合

Chrome 123 為 Attribution Reporting API 新增了觸發資料自訂選項和可匯總的值篩選器,重點如下:

  • 支援自訂觸發資料基數和值,為事件層級報表提供額外的 API 設定功能。
  • 透過支援可匯總值中的篩選器,為摘要報表提供額外的 API 設定選項。

跨應用程式和網站歸因評估

擴充 Attribution Reporting API,將網站上的轉換歸因給瀏覽器以外的其他應用程式中發生的事件。

這項提案會利用 OS 層級的歸因支援功能。特別是,開發人員可以選擇允許行動版網站上的事件與 Android 版 Privacy Sandbox 中的事件進行彙整,但也可以實作其他平台的支援功能。

blocking=render 在內嵌模組指令碼上

這項小幅異動可移除 <script blocking="render"> 的人為限制。在這個異動之前,<script blocking="render"type="module"> 需要 src 屬性,即使這個 src 是資料 URI 也一樣。這是不必要的限制,因為匯入其他指令碼的內嵌模組指令碼仍應能進行轉譯區塊。

這項做法的動機在於,跨文件檢視畫面轉場通常會依賴轉譯阻斷指令碼進行自訂,因此只要讓轉譯阻斷指令碼更容易撰寫,就能支援這項功能。

文件子母畫面:允許 focus() API 將焦點放在開啟者

您現在可以使用文件子母畫面視窗中的 opener.focus(),將系統層級焦點帶到擁有文件子母畫面視窗的分頁。

這可讓開發人員在必要時將原始分頁帶回前景。例如,當使用者需要存取不符合較小子母畫面視窗的 UI 體驗時。

匯入屬性 with 語法

匯入屬性是 JavaScript 功能,可用於註解匯入宣告,例如 import xxx from "mod" with { type: "json" }。Chrome 最初以 Chrome 91 版本推出先前版本的提案,其中使用 assert 做為關鍵字。由於整合 HTML for JSON 和 CSS 模組時需要進行一些變更,因此這個版本已更新為使用 with

jitterBufferTarget

jitterBufferTarget 屬性可讓應用程式指定 RTCRtpReceiver 抖動緩衝區要保留的媒體目標時間長度 (以毫秒為單位)。這會影響使用者代理程式執行的緩衝量,進而影響重傳和封包遺失的復原作業。變更目標值可讓應用程式控制播放延遲與因網路抖動而導致音訊或影像影格耗盡的風險之間的權衡。

長動畫影格時間

Long Animation Frames APILong Tasks API 的擴充功能。這項指標會與後續的轉譯更新一併評估工作,並加入長時間執行的腳本、轉譯時間,以及強制版面配置和樣式所花費的時間等資訊,這稱為版面配置耗損

開發人員可以使用這項指標診斷「緩慢」問題,這項指標由 INP 評估,藉由找出主執行緒壅塞的原因,而這通常是導致 INP 不佳的因素。

NavigationActivation 介面會新增 navigation.activation。這個屬性會儲存目前文件啟用狀態 (例如初始化或從往返快取還原)。

這表示開發人員可以根據使用者導覽的來源,提供自訂網頁。舉例來說,如果使用者來自首頁,就執行不同的動畫。

pagereveal 事件

在以下情況下,系統會在首次轉譯機會時,在文件的視窗物件上觸發 pagereveal 事件:初次載入、從前進/後退快取還原,或從預先轉譯啟用。

網頁作者可使用這項功能設定網頁進入體驗,例如從先前狀態轉換至檢視畫面。

多筆觸控書寫功能的 PointerEvent.deviceId

隨著具備進階觸控筆輸入功能的裝置越來越普遍,網頁平台必須持續演進,全面支援這些進階功能,為使用者和開發人員提供豐富的體驗。其中一個進步之處,就是裝置的數位化器可同時辨識多個與其互動的觸控筆裝置。這項功能是 PointerEvent 介面的擴充功能,可納入新的屬性 deviceId,代表工作階段持續性、文件隔離的專屬 ID,開發人員可可靠地使用此 ID 來識別與頁面互動的個別筆。

針對導覽要求的私人網路存取權檢查:僅警告模式

在網站 A 前往使用者私人網路中的其他網站 B 之前,這項功能會執行以下操作:

  1. 檢查要求是否已從安全的環境啟動。
  2. 傳送預檢要求,並檢查 B 是否會以允許私人網路存取權的標頭回應。

雖然已經有子資源和 worker 的功能,但這項新增功能專門適用於導覽要求。

這些檢查是為了保護使用者的私人網路。由於這項功能是「僅警告」模式,因此如果任何檢查失敗,系統就不會拒絕要求。而是會在 DevTools 中顯示警告,協助開發人員為即將實施的政策做好準備。

Sec-CH-UA-Form-Factor 用戶端提示

這個提示會指出使用者代理程式或裝置的「外觀」,讓網站能調整回應。

Service Worker 靜態轉送 API

這個 API 可讓開發人員設定路由,並卸載 Service Worker 執行的簡單工作。如果條件相符,系統就會在未啟動 Service Worker 或執行 JavaScript 的情況下進行導覽,讓網頁避免因 Service Worker 攔截而導致效能受損。詳情請參閱這篇 API 相關網誌文章

共用儲存空間更新

這項更新支援執行跨來源 Worklet,而無須建立 iframe。

zstd Content-Encoding

Zstandard (zstd) 是 RFC8878 中所述的資料壓縮機制。這是一種快速的無損壓縮演算法,可在 zlib 等級提供即時壓縮情境,並提供更佳的壓縮率。zstd 權杖已新增為 IANA 註冊的 Content-Encoding 權杖。

新增 zstd 支援功能做為 Content-Encoding,可加快網頁載入速度、減少頻寬使用量,並減少在伺服器上壓縮內容所需的時間、CPU 和電力,進而降低伺服器成本。

新的來源試用

在 Chrome 123 中,您可以選擇參與下列新的來源試用

WebAssembly JavaScript Promise 整合

為了支援使用 WebAssembly 編寫的回應式應用程式,您必須提供可讓 WebAssembly 程式暫停和恢復的功能。

承諾整合的主要初始用途,是允許來源依賴同步 API 的 WebAssembly 程式,使用在網頁平台上越來越常見的非同步 API。

註冊承諾整合來源試用計畫

移除

Chrome 123 會移除下列功能。

權限和權限政策 window-managementwindow-placement 別名

在 Chrome 111 中,window-management 已新增,做為 window-placement 權限和權限政策字串的別名。這項計畫是為了重新命名字串,最終淘汰並移除 window-placement,隨著 Window Management API 隨時間演進,這個術語變更可延長描述子的壽命。

window-placement 別名的淘汰警告自 Chrome 113 版開始,現在已移除。