Chrome 97 版的新功能

Pete LePage

以下是一些注意事項：

• WebTransport 是可在用戶端和伺服器之間傳送即時訊息的新選項。
• 您可以使用功能偵測功能，查看瀏覽器支援的指令碼類型。
• 從末端搜尋陣列會比較簡單。
• 還有更多應用程式。

新年快樂！我是 Pete LePage。我們來深入說明 瞭解 Chrome 97 版開發人員推出的新功能

網路傳輸

如果您使用 Web Socket 或 WebRTC Data Channel API，在伺服器和網頁之間傳送訊息，可以選擇新的選項。WebTransport 是新的 API，提供低延遲的雙向用戶端伺服器訊息傳遞服務。

它的延遲時間比 WebSocket 低，且與專為點對點訊息設計的 RTC Data Channel API 不同，Web Transport API 特別專為用戶端伺服器的訊息傳遞設計。

支援傳送資料，以可靠的串流 API 傳送資料，不穩定地使用 Datagram API。可在網路工作站中使用。此外，由於其會顯示與串流相容的介面，因此支援有關背壓的最佳化。

如要使用，您需要支援 HTTP/3 的伺服器，此機制通常比設定及維護 WebRTC 伺服器來得簡單。開啟新的 WebTransport 執行個體，等待其連線後，您就可以開始傳送資料。

const url = 'https://example.com:4999/foo/bar';
const transport = new WebTransport(url);
await transport.ready;

const writer = transport.datagrams.writable.getWriter();
const data1 = new Uint8Array([65, 66, 67]);
writer.write(data1);

如需完整詳細資料，請參閱 web.dev 上的實驗 WebTransport 文章。

指令碼類型特徵偵測

目前，我們可以使用 nomodule 屬性偵測瀏覽器是否支援 JavaScript 模組。但管道中有一些新功能提案，例如匯入對應、推測規則及套件預先載入。我們需要有一種方式，瞭解瀏覽器支援哪些功能。

輸入「HTMLScriptElement.supports()」。您可以使用該文字來判斷可用的指令碼類型，並將最佳選項傳送給瀏覽器。

if (HTMLScriptElement.supports('importmap')) {
  // Use <script type="importmap" ...>
} else if (HTMLScriptElement.supports('module')) {
  // Use <script type="module" ...>
} else {
  // Use classic method...
}

新增陣列原型

我愛死它，JavaScript 變得更加簡單。Array 和 TypedArray 現在支援 findLast() 和 findLastIndex() 靜態方法。

這些函式實際上與 find() 和 findIndex() 相同，但會從陣列尾端搜尋，而非開頭。

舉例來說，如要找出大於 10 的陣列中的最後一個數字，請使用測試函式呼叫 findLast()，檢查該值是否大於 10，這樣就沒問題。

const array1 = [5, 12, 8, 130, 44, 3, 6];

function greaterThanTen(val) {
  return val > 10;
}

const last = array1.findLast(greaterThanTen);
// 44

const lIdx = array1.findLastIndex(greaterThanTen);
// 4

在 UA 字串中模擬 Chrome 100

我們將在幾個月後達到 Chrome 100 的三位數版本號碼。 凡是會檢查版本號碼或剖析通用 Analytics (分析) 字串的程式碼，都應檢查，確保其處理的是三位數。

有一個名為 #force-major-version-to-100 的標記會將目前的版本號碼變更為 100，所以您可以確保一切都如預期運作。

還有更多獎品等著您！

當然還有許多其他東西。

表單項目中的新行現已正規化，方法與 Gecko 和 WebKit 相同，有助改善瀏覽器之間的互通性。

我們將用戶端提示名稱在前面加上 sec-ch，藉此將名稱標準化。舉例來說，dpr 會變為 sec-ch-dpr。我們會繼續支援這些提示的現有版本，但也建議您規劃最終的淘汰與移除作業。

關閉的 <details> 元素現在可供搜尋且可連結。使用頁面、ScrollToTextFragment 和元素片段導覽功能時，這些隱藏元素會自動展開。

其他資訊

這僅涵蓋部分重點功能。如要瞭解 Chrome 97 版的其他變更，請點選下方連結。

• Chrome 開發人員工具新功能 (97)
• Chrome 97 淘汰和移除
• 適用於 Chrome 97 的 ChromeStatus.com 更新
• Chrome 97 版 JavaScript 新功能
• Chromium 原始碼存放區變更清單
• Chrome 發布時間表

訂閱

如要隨時掌握最新資訊，請訂閱 Chrome Developers YouTube 頻道。每當我們推出新影片時，您就會收到電子郵件通知。

我是 Pete LePage，只要 Chrome 98 版推出，我就會在這裡為您提供 Chrome 的新功能！