Chrome 116 Beta 版

CSS 動態路徑、往返快取 NotRestoredReason API、文件子母畫面等。

除非另有註明,否則上述變更將適用於 Android、ChromeOS、Linux、macOS 和 Windows 的最新 Chrome Beta 版 Chrome 測試版。透過提供的連結或 ChromeStatus.com 上的清單,進一步瞭解這裡列出的功能。Chrome 116 目前為 Beta 版,截至 2023 年 7 月 19 日。你可以透過電腦前往 Google.com 下載最新版本,也可以透過 Android 裝置前往 Google Play 商店下載最新版本。

CSS

這個版本新增兩項 CSS 功能,

CSS 動態路徑

動態路徑可讓作者設定任何圖形物件的位置,並根據開發人員指定的路徑將物件加入動畫。這可讓您使用許多強大的全新轉換可能性,例如使用極座標 (搭配 ray() 函式) 來定位,而非使用 translate() 函式使用的標準矩形座標,或是為定義路徑上的元素建立動畫。這樣就能更輕鬆地定義複雜且精美的 2D 空間轉場效果。路徑可以指定為 circle()ellipse()rect()inset()xywh()polygon()ray()url()

顯示和內容的顯示動畫

Chrome 116 支援主要畫面格動畫中的 displaycontent-visibility 屬性。透過這項支援,開發人員可以建立結束動畫,然後元素會自動變成 display: nonecontent-visibility: hidden,而不需要編寫任何 JavaScript 來處理動畫結束後的切換。這樣一來,您只可在 CSS 中單獨新增元素的結束動畫。

網站 API

AbortSignal.any()

傳回在任何來源信號取消時取消的信號。開發人員可使用此功能結合獨立取消來源,例如使用 AbortSignal.timeout() 指定的逾時時間、與 AbortController 相關的信號,並將這些信號傳遞至 fetch() 等非同步 API。

針對 Fetch 支援 BYOB 支援

Chrome 的 ReadableStream 可實作自備緩衝區 (BYOB) 讀取器,以便讀取可讀取的位元組串流。現在,Response.body 也是可讀取的位元組資料流,而非「預設」可讀取的串流。這樣就可以搭配使用 Fetch API,與 BYOB 讀取器搭配使用,減少垃圾收集和複製作業的負擔,並改善使用者的回應速度。現在,Blob.stream() 也能受益於這項最佳化功能。

往返快取 NotRestoredReason API

NotRestoredReason API 會透過 PerformanceNavigationTiming API,在頁框樹狀結構中的 BFcache 回報網頁未提供的原因清單。

文件子母畫面

文件子母畫面新增 API,可開啟常駐視窗且可填入任意 HTMLElements 的視窗。此為現有 HTMLVideoElement API 的展開,僅允許 HTMLVideoElement 進入子母畫面 (PiP) 視窗。這可讓網頁程式開發人員為使用者提供更優質的子母畫面體驗。

在權限政策來源中展開萬用字元

許可清單中的子網域萬用字元提供極具彈性的彈性,但與現有的萬用字元剖析器不同,且需要新的程式碼和規格工作。這項意圖可以重複使用現有的內容安全政策規格中的部分,並允許將 scheme + wildcard domainwildcard port 加入許可清單,藉此減少開銷。具體來說,這個意圖會採用主機來源和配置來源的定義,而非許可清單定義中的來源,同時要求路徑部分為空白 (因為權限政策將套用至相符的來源)。

FedCM 套裝組合:Login Hint API、User Info API 和 RP Context API

這項套裝組合更新允許自訂使用 Federated Credential Management API (FedCM) 的聯合登入流程。

透過 Login Hint API,依賴方 (RP) 能夠針對要在 FedCM 使用者介面中顯示的使用者帳戶提示。主要用途是為回訪者提供更優質的使用者體驗。

User Info API 可讓識別資訊提供者 (IdP) 擷取使用者資訊,以便為回訪者提供個人化的登入體驗,例如透過個人化的「使用 IdP 登入」按鈕。

透過 RP Context API,RP 可以要求 FedCM 對話方塊,將「登入」標題替換成「註冊」、「使用」或「繼續」,讓實際意圖保持一致。

非組合的滑鼠和指標進入/離開事件

mouseentermouseleavepointerenterpointerleave 事件 "false" 中的 event.composed 屬性符合規格要求,並修正互通性差距。滑鼠事件的 UI 事件規格和指標事件規格都會將這些事件定義為非組合。這兩款規格已在幾年前淘汰原始定義,也就是 https://github.com/w3c/uievents/pull/210 https://github.com/w3c/pointerevents/pull/461 所採取的措施,除瞭解決互通性陰影問題外,這項變更也修正了在 Chromium 中監聽 DOM 事件失誤的雙重或三分機制。

移除 document.open 沙箱沿用機制

目前,當 document.open 指定不同的視窗時,呼叫端的沙箱旗標目前會套用至呼叫端。這項異動生效後將不再適用。

回報 Critical-CH 導致 NavigationTiming 造成重新啟動的問題

網站可以在 Critical-CH HTTP 回應標頭中加入特定 Client 提示,藉此表示該網頁對網頁至關重要。這樣一來,如果 Critical-CH HTTP 回應標頭中列出的提示可以 (但不是) 包含在最初傳送的 HTTP 要求中,就會觸發連線重新啟動。這項意圖提議將 readonly attribute DOMHighResTimeStamp criticalCHRestart; 新增至 PerformanceNavigationTiming 介面。

正在進行來源試用

在 Chrome 116 中,您可以選擇啟用下列新的來源試用

COOP:限制屬性

Cross-Origin-Opener-Policy 用於中止彈出式視窗與開啟工具之間的關係,以提升安全性。「restrict-properties」是一個提議的值,可限制關係,而非完全分割該值。與 COEP 配對時,這麼做會啟用 crossOriginIsolated。

註冊 COOP 限制屬性來源試用

FedCM 登入狀態 API

Federated Credential Management API (FedCM) 的 IdP 登入狀態 API 可讓識別資訊提供者 (IdP) 在使用者登入/登出時通知瀏覽器,讓 FedCM 能夠最佳化其使用者體驗,進而增加隱私屬性。

註冊 FedCM 登入狀態來源試用

EditContext API

EditContext API 可簡化將網頁應用程式與進階文字輸入法 (例如 VK 形狀撰寫、手寫面板、語音辨識和 IME 組成) 的整合程序。這個 API 不僅改善無障礙功能和效能,還為網頁式編輯器帶來全新的功能。

報名參加 EditContext API 來源試用

長動畫影格時間

這個擴充功能可執行長時間工作。這個 API 會測量工作及其後續算繪更新,添加資訊,例如長時間的執行指令碼、轉譯時間,以及強製版面配置和樣式耗費的時間,稱為「版面配置延遲」

開發人員可以使用 INP 評估「緩慢性」診斷結果,找出主執行緒壅塞的原因,通常是 INP 出錯的原因。

註冊 Long Animation Frame Timing 來源試用