網路平台 10 月新知

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

2024 年 10 月,Firefox 131Firefox 132Safari 18.1Chrome 130 都已穩定推出。這篇文章將介紹網站平台新增的功能。

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

Browser Support

  • Chrome: 122.
  • Edge: 122.
  • Firefox: 131.
  • Safari: not supported.

Source

文字片段

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

Browser Support

  • Chrome: 89.
  • Edge: 89.
  • Firefox: 131.
  • Safari: 18.2.

Source

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

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

Browser Support

  • Chrome: 114.
  • Edge: 114.
  • Firefox: 131.
  • Safari: not supported.

Source

媒體更新

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

Browser Support

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

Source

也包含 MediaStreamTrack.getCapabilities() 方法。

Browser Support

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

Source

fetchPriority

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

如需進一步瞭解,請參閱「使用 Fetch Priority API 最佳化資源載入」一文。

Browser Support

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

Source

完整支援 box-decoration-break

Chrome 130 提供完整的 CSS box-decoration-break 屬性支援,且不含前置字串。包括區塊和內嵌分割作業的 clone 值。

Browser Support

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

Source

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

巢狀宣告規則

Chrome 130 和 Firefox 132 支援 CSS 巢狀宣告,這表示巢狀 CSS 會正確剖析,如「CSS 巢狀結構改善了 CSSNestedDeclarations」一文所述。

Browser Support

  • Chrome: 130.
  • Edge: 130.
  • Firefox: 132.
  • Safari: 18.2.

Source

Web Serial connected 屬性和 RFCOMM 連線事件

Chrome 130 新增了布林 SerialPort.connected 屬性。如果序列埠在邏輯上已連線,則屬性會傳回 true。

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

這項功能可讓應用程式在未開啟藍牙 RFCOMM 序列埠的情況下,偵測藍牙 RFCOMM 序列埠是否可用。

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

Browser Support

  • Chrome: 130.
  • Edge: 130.
  • Firefox: not supported.
  • Safari: not supported.

Source

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 邊界框,因此您可以在從網路列印時提供自訂頁首和頁尾。