網路平台 10 月新知

瞭解 2024 年 10 月推出的穩定版和 Beta 版網頁瀏覽器中,有哪些有趣的功能。

Firefox 131Firefox 132Safari 18.1Chrome 130 已於 2024 年 10 月穩定執行。這篇文章將介紹網頁平台新增的功能。

Firefox 131 新增對同步疊代器輔助程式的支援。例如 Iterator.prototype.forEach()Iterator.prototype.map()。這些輔助程式允許在疊代器上進行類陣列作業,不需建立中繼陣列物件,包括無法建立中繼陣列的超大型資料集。

瀏覽器支援

  • Chrome:122。
  • Edge:122。
  • Firefox:131。
  • Safari:不支援。

資料來源

文字片段

Firefox 131 也支援文字片段,以及 CSS ::target-text 虛擬元素。

瀏覽器支援

  • Chrome:89。
  • Edge:89。
  • Firefox:131。
  • Safari 技術預覽:支援。

資料來源

具有獨立分區狀態的 Cookie (CHIPS)

Firefox 131 包含 CHIPS,可讓您使用 Set-Cookie HTTP 標頭的 partitioned 指令,將 Cookie 選入分割儲存空間。

瀏覽器支援

  • Chrome:114。
  • Edge:114。
  • Firefox:131。
  • Safari:不支援。

資料來源

媒體更新

在 10 月推出的第二個 Firefox 版本中,有一系列媒體功能加入了「新版基準」功能。Firefox 132 包含 HTMLVideoElementrequestVideoFrameCallback()cancelVideoFrameCallback() 方法。

瀏覽器支援

  • Chrome:83。
  • Edge:83。
  • Firefox:132。
  • Safari:15.4。

資料來源

也包含 MediaStreamTrack.getCapabilities() 方法。

瀏覽器支援

  • Chrome:59。
  • Edge:12.
  • Firefox:132。
  • Safari:11。

資料來源

fetchPriority

Fetch Priority API 會指出資源在瀏覽器中的相對優先順序。這項 API 自 Firefox 132 起便受到支援,也就是說,這項實用的 API 現已成為新基準。

詳情請參閱使用 Fetch Priority API 改善資源的載入方式

瀏覽器支援

  • Chrome:102。
  • Edge:102。
  • Firefox:132。
  • Safari:17.2。

資料來源

完整的 box-decoration-break 支援

Chrome 130 包含無前置字串的完整支援 CSS box-decoration-break 資源。包括區塊和內嵌分割作業的 clone 值。

瀏覽器支援

  • Chrome:130。
  • Edge:130。
  • Firefox:32。
  • Safari:7。

資料來源

如要進一步瞭解這個屬性,請參閱 Chrome 130 中的 box-decoration-break 屬性

巢狀宣告規則

Chrome 130 和 Firefox 132 支援 CSS 巢狀宣告,這表示系統已正確剖析巢狀 CSS,如 CSSNestedDeclarations 改善 CSS 巢狀結構中所述。

瀏覽器支援

  • Chrome:130。
  • Edge:130。
  • Firefox:132。
  • Safari:不支援。

Web Serial connected 屬性和 RFCOMM 連線事件

Chrome 130 新增了布林值 SerialPort.connected 屬性。如果序列埠是以邏輯方式連線,則此屬性會傳回 true。

有了這項功能,藍牙 RFCOMM 序列埠就能在邏輯連線或中斷連線時調度這些事件。

這項功能可讓應用程式在不開啟通訊埠的情況下,偵測可使用藍牙 RFCOMM 序列埠。

詳情請參閱「Web Serial 中的藍牙 RFCOMM 更新」。

瀏覽器支援

  • Chrome:130。
  • Edge:不支援。
  • Firefox:不支援。
  • Safari:不支援。

Safari 的無障礙功能修正

Safari 18.1 版本緊接在 Safari 18 之後推出,並修正了許多無障礙功能問題,特別是 display: contents 的問題。

Beta 版瀏覽器版本

瀏覽器測試版可讓您預覽瀏覽器的下一個穩定版。在正式發布前,您可以測試可能影響網站的新功能或移除項目。新的 Beta 版為 Firefox 133Chrome 131。這些版本為平台帶來許多實用功能。查看版本資訊,瞭解所有詳細資訊。以下列舉其中幾項重點。

Firefox 133 支援 WebCodecs APIImageDecoderImageTrackListImageTrack 介面,可從主執行緒和工作執行緒解碼圖片。

Firefox 133 也支援 WorkerNavigator.permissions

Chrome 131 包含 CSS 醒目顯示繼承功能,其中 CSS 醒目顯示虛擬類別 (例如 ::selection::highlight) 會透過虛擬醒目顯示鏈結,而非元素鏈結,繼承其屬性。結果讓屬性在醒目顯示中繼承屬性,是更直觀的模型。

Chrome 131 也支援 CSS 分頁媒體 @page 邊界框,因此您可以在從網路列印時提供自訂頁首和頁尾。