探索 2024 年 1 月在穩定版和 Beta 版網路瀏覽器中推出的一些有趣功能。
穩定版瀏覽器
自 2024 年 1 月，Firefox 122、Chrome 121 和 Safari 17.3 已穩定執行。這篇文章介紹了網路平台新增的功能。
<select>的<hr>
Firefox 122 會將 <hr> 元素新增為 <select> 元素的允許子項。
這有助於提供提供許多選項的選取清單，方便閱讀。所有主要的瀏覽器引擎現在都支援這項功能。不過請注意，目前沒有任何瀏覽器會將 <hr> 暴露在無障礙樹狀結構中。
瀏覽器支援
- 119
- 119
- 122
- 17
HTMLSelectElement.showPicker
Firefox 中的 <select> 元素也是 HTMLSelectElement 的 showPicker() 方法。這和一般會在選取元素時顯示的挑選器，但可透過按下按鈕或其他使用者互動的方式觸發。
最大內容繪製 (LCP) API
Firefox 122 也支援 LCP API。這個效能 API 可在使用者與網頁互動之前，提供最大圖片或文字繪製的時間資訊。如要進一步瞭解 LCP，請參閱 LCP 說明文件。
CSS 捲軸屬性
Chrome 121 版開始支援捲軸屬性 scrollbar-color 和 scrollbar-width。詳情請參閱捲軸樣式一文。
CSS font-palette 動畫
font-palette 屬性可讓您選取特定調色盤，以顯示顏色字型。這個屬性現在支援動畫，因此切換調色盤後，即可在所選的兩個調色盤之間順暢轉換。
ArrayBuffer 的 transfer() 和 transferToFixedLength() 方法
Firefox 包含 ArrayBuffer 的 JavaScript transfer() 和 transferToFixedLength() 方法。transfer() 方法會建立具備與目前 ArrayBuffer 相同的位元組內容的新 ArrayBuffer，然後卸離原本的 ArrayBuffer。transferToFixedLength() 方法的運作方式相同，但會建立固定大小的 ArrayBuffer。
Speculation Rules API 更新
網站會使用 Speculation Rules API，能以程式輔助方式指示 Chrome 要預先轉譯哪些頁面，進而縮短頁面瀏覽時間，打造更優質的使用者體驗。
Chrome 121 版支援文件規則：這是推測規則語法的延伸，可讓瀏覽器取得網址清單，以便推測從網頁中的元素載入。文件規則可以提供這些連結適用的條件。在這個項目加上新的「eagerness」欄位後，您就能立即在遊標懸停或向下捲動時，自動預先擷取或預先轉譯網頁上的連結。
Beta 版瀏覽器版本
Beta 版瀏覽器可讓您預覽下一個穩定版的功能。趁這個機會在全球推出前，測試或移除可能影響網站的新功能。新的 Beta 版測試為 Firefox 123、Chrome 122 和 Safari 17.4。這些版本為 YouTube 平台帶來許多絕佳功能。完整資訊請參閱版本資訊。以下僅列出幾項重點功能。
Firefox 123 Beta 版包含宣告式 Shadow DOM。
另外，Firefox 123 也支援 103 Early Hints HTTP 資訊回應狀態碼，用於預先載入資源，因為伺服器準備完整回應時，網頁可能需要資源。
Safari 17.4 Beta 版中有許多好用的功能。CSS 支援在區塊容器和資料表儲存格中使用 @scope、align-content，以及 ::grammar-error 和 ::spelling-error 虛擬元素，除此之外還有更多功能。
在表單中，表單控制項支援垂直寫入模式、<input type="date"> 的 showPicker() 方法，以及 iOS 上 <select> 中 <hr> 的支援。
JavaScript 還支援 ArrayBuffer 的 detached()、transfer() 和 transferToFixedLength() 方法，以及其他幾項新功能。
Chrome 122 Beta 版在 Async Clipboard API 的 read() 方法中加入 unsanitized 選項，可用於擷取未經處理的 HTML 格式。針對 JavaScript，您可以使用新的疊代器輔助程式，以及內建 Set 類別的新方法。
此外，Chrome 122 也使用 Storage Buckets API，讓使用者更容易在記憶體壓力偏高時可預測是否清除永久儲存空間。