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

Chrome 84 版的新功能

Pete LePage

Chrome 84 現正推出穩定版。

以下是一些注意事項：

使用者可以透過應用程式圖示捷徑，在應用程式中啟動常見工作。
Web Animation API 新增了更多先前不支援的功能。
Wake Lock 可阻止螢幕變暗或鎖定。
Content Indexing API 可協助顯示可離線使用的內容。
有新的閒置偵測和 Web Assembly SIMD 來源試用。
相同網站 Cookie 政策異動將陸續生效。
享有更多實用功能。

我是 Pete LePage，它在家工作與射擊。現在我們來深入探索 Chrome 84 開發人員推出的新功能！

應用程式圖示捷徑

應用程式圖示捷徑可讓使用者輕鬆在應用程式中快速啟動常見工作，例如撰寫新的 Tweet、傳送訊息，或查看通知。Chrome for Android 支援這些樣式。

長按 Android 上的應用程式圖示即可叫用這些捷徑。新增 PWA 的捷徑相當簡單，在網頁應用程式資訊清單中建立新的 shortcuts 屬性、說明捷徑，以及新增圖示。

"shortcuts": [
  {
    "name": "Open Play Later",
    "short_name": "Play Later",
    "description": "View the list you saved for later",
    "url": "/play-later",
    "icons": [
      { "src": "//play-later.png", "sizes": "192x192" }
    ]
  },
]

如需完整的詳細資訊，請參閱「使用應用程式捷徑快速完成工作」一文。

網頁動畫 API

Chrome 第 84 版在 Web Animation API 中新增了多種先前不支援的功能。

animation.ready和animation.finished已合法化。
瀏覽器現在可以清除並移除舊的動畫，節省記憶體並提升效能。
此外，您現在可以使用複合模式與 add 和 accumulate 選項結合動畫。

我無法單純完成所有改善項目，或是在這裡提供優質範例，詳情請參閱 Chromium 84 中的 Web Animation API 改善項目。

Content Indexing API

即使沒有網路連線也能觀看您的內容。但使用者並不知道？這個 SDK 真的可以發布嗎？發現發現問題！

Content Indexing API 是剛結束的初始試用版本，您可以為可離線使用的內容新增網址和中繼資料，然後使用該中繼資料向使用者顯示內容，藉此提高曝光度。

如要將內容新增至索引，請在 Service Worker 註冊作業中呼叫 index.add()，並提供內容所需的中繼資料。

const registration = await navigator.serviceWorker.ready;
await registration.index.add({
  id: 'article-123',
  url: '/articles/123',
  launchUrl: '/articles/123',
  title: 'Article title',
  description: 'Amazing article about things!',
  icons: [{
    src: '/img/article-123.png',
    sizes: '64x64',
    type: 'image/png',
  }],
});

想要查看索引中現有的內容嗎？呼叫服務工作站註冊中的 index.getAll()。

const registration = await navigator.serviceWorker.ready;
const entries = await registration.index.getAll();
for (const entry of entries) {
  // entry.id, entry.launchUrl, etc. are all exposed.
}

詳情請參閱使用 Content Indexing API 為可離線的網頁建立索引一文。

Wake Lock API

我喜歡烹飪，但我覺得自己在參考食譜後就會覺得螢幕保護程式太了不起透過 Wake Lock API (同樣在 Chrome 84 版中升級)，網站可以要求 Wake Lock，防止螢幕變暗及鎖定。

事實上，Betty Crocker 網站已在使用這項工具，並於 web.dev 發布個案研究，顯示購買意願指標增幅達 300%。

如要取得 Wake Lock，請呼叫 navigator.wakeLock.request()，會傳回一個用來「釋放」Wake Lock 的 WakeLockSentinel 物件。

// Request the wake lock
const wl = await navigator.wakeLock.request('screen');

// Release the wake lock
wl.release();

當然，這還只是一些例子，因此請參閱「使用 Screen Wake Lock API 保持清醒」一文，但至少我的螢幕不會被灌水！

來源試用

我想說明兩項新的來源試用，如果您不熟悉來源試用，請參閱「開始使用 Chrome 的來源試用」。

閒置偵測

使用者處於閒置狀態時，Idle Detection API 會通知您，表示使用者可能離開電腦。這在即時通訊應用程式或社群網站等方面非常實用，可讓使用者知道聯絡人是否有空。

// Create the idle detector
const idleDetector = new IdleDetector();

// Set up an event listener that fires when idle state changes.
idleDetector.addEventListener('change', () => {
  const uState = idleDetector.userState;
  const sState = idleDetector.screenState;
  console.log(`Idle change: ${uState}, ${sState}.`);
});

// Start the idle detector.
await idleDetector.start({
  threshold: 60000,
  signal,
});

如要進一步瞭解這個 API，以及如何立即開始試用 API，請參閱「使用 Idle Detection API 偵測閒置使用者」。

網路組裝 SIMD

Web Assembly SIMD 則會啟動來源試用。並導入可對應至硬體中常見 SIMD 指示的作業。SIMD 作業可用來提升效能，特別是在多媒體應用程式中。

如要進一步瞭解 WebAssembly SIMD，請參閱「採用 WebAssembly SIMD 的快速平行應用程式」。

其他更新

雖然 Chrome 84 版很龐大，但還有一些重要更新需要說明。

我們將恢復逐步推出 SameSite Cookie 異動。
針對有濫用權限要求或誤導型通知的網站，系統會自動在優先通知 UI 中註冊網站。
我們推出了新的 QuicTransport 來源試用，

其他資訊

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

如要隨時掌握 YouTube 影片的最新消息，然後訂閱我們的 Chrome Developers YouTube 頻道，每當推出新影片時，您都會收到電子郵件通知。

我是 Pete LePage，我還需要修剪頭髮。不過，在 Chrome 第 85 版推出後，我很樂意立即向您說明：Chrome 的新功能！