本頁面由 Cloud Translation API 翻譯而成。

Chrome 95 版的新功能

Pete LePage

以下是一些注意事項：

將 URLPattern 整合至瀏覽器，讓轉送更輕鬆。
Eye Dropper API 提供內建工具供您選取色彩。
你可以使用新的來源試用功能，選擇接收縮減通用 Analytics 字串。
PWA 高峰會影片全都在上網。
除此之外，你還有更多功能。

我是 Pete LePage，負責工作和射擊現在就來深入探索，瞭解 Chrome 95 為開發人員提供了哪些新功能。

使用「`URLPattern`」規劃路線

幾乎所有網頁應用程式都仰賴轉送功能，無論是否由程式碼執行伺服器會將檔案的路徑對應到單頁應用程式中的磁碟檔案或邏輯，在網址變更時更新 DOM。URLPattern 是新的網頁提供標準化轉送模式語法的平台 API

以現有架構為基礎，將更容易執行常見的轉送任務例如，比對完整網址或網址 pathname，然後傳回與符記和群組相符項目相關的資訊。

如果您已熟悉 Express 中使用的轉送語法， Ruby on Rails 或「path-to-regexp」path-to-regexp似乎並不陌生。

如要使用，請建立新的 URLPattern()，並提供所需的詳細資料比對模式模式可包含萬用字元、已命名的符記群組規則運算式群組和群組修飾符

const p = new URLPattern({
  protocol: 'https',
  hostname: 'example.com',
  pathname: '/:folder/*/:fileName.jpg',
  search: '*',
  hash: '*',
});

舉例來說，以下來看看 Google 文件可能使用的 URLPattern。我們將指定檔案的 kind、ID 檔案，以及要在哪個 mode 中開啟該檔案。接著，如要使用該模式，我們可以呼叫 test() 或 exec()。

const url = 'https://docs.google.com/document/d/1s...5c/edit#heading=h.8...c';

const pattern = new URLPattern({
  pathname: '/:kind/d/:fileID/:mode',
  hash: '*',
});

const r = pattern.exec(url);
// {
//   "pathname": {"groups": {
//     "fileID": "1s...5c",
//     "kind": "document",
//     "mode": "edit"
//   }, ...},
//   "hash": {"groups": {"0":"heading=h.8...c"}, ...},
//   ...
// }

根據預設，URLPattern 會在 Chrome 和 Edge 95 以上版本中啟用。但對於 Node 等尚未支援的瀏覽器或環境您可以使用 urlpattern-polyfill 程式庫

查看 Jeff 的文章：URLPattern 為網路平台提供轉送，瞭解完整的資訊！

使用 Eye Dropper API 挑選顏色

我用過的設計應用程式幾乎都提供防滑工具大家可以輕鬆確定顏色是什麼顏色部分瀏覽器有滴管內建 <input type=color> 功能，但並不理想。

Microsoft 的某些人員導入了 Eyee dropper API，相關功能如要使用，請建立新的 EyeDropper() 執行個體，然後在該執行個體上呼叫 open()。

const eyeDropper = new EyeDropper();
const result = await eyeDropper.open();
// result = {sRGBHex: '#160731'}

如同其他許多新型網路 API，它也是以非同步方式運作，並未封鎖主執行緒當使用者點選自己想要的顏色時元件會呈現他們點選過的顏色

您可以試試看簡短的示範程式碼。

PWA 高峰會

你是否曾在本月稍早參加 PWA 高峰會？

看到許多人談論 PWA 以及分享他們的這點十分重要如果您錯過任何一次，請務必繼續觀看 PWASummit.org 或 PWA 高峰會 YouTube 頻道。

使用者代理程式縮減來源試用

「使用者代理程式縮減」機制旨在減少被動式的機會減少使用者代理程式中的資訊字串僅限瀏覽器品牌和重要版本、電腦版或行動版和用來執行裝置的平台

自 Chrome 95 版起，我們提供新的來源試用服務，可讓您選擇接收經過簡化的通用 Analytics 字串。這會啟用，在受影響的通用 Analytics 成為預設值前，找出並修正問題行為。

這些變更會逐步套用至多個版本，但您準備與測試所需的一切都已經準備就緒了。

您可以在 User-Agent Reduction 來源試用貼文 developer.chrome.com.

還有更多獎品等著您！

當然，還有許多其他功能

如果您一直遵循 Storage Foundation API 的運作，以下存取控制代碼的來源試用。
WebAssembly 現已提供例外狀況處理支援，擲回例外狀況時，可讓程式碼中斷控制流程。
Chrome 100 將於明年推出。因此現在您應確認程式碼能處理超過兩位數！

延伸閱讀

這只涵蓋部分重點功能。請點選下方連結查看 Chrome 95 的其他變更。

想要隨時掌握最新動態，歡迎訂閱方案 Chrome Developers YouTube 頻道每次推出新影片時，您都會收到電子郵件通知。

我是 Pete LePage，Chrome 96 推出後，我將立即支援告訴你 Chrome 的新功能！