Chrome 60 新功能

需要完整的變更清單嗎?詳情請參閱 Chromium 原始碼存放區變更清單

我是 Pete LePage。讓我們深入探索 Chrome 60 為開發人員提供的新功能!

繪製時間 API

使用者前往網頁時,會先尋找視覺回饋,確認一切運作正常。有了新的繪製時間 API 我們就能評估這點

API 公開了兩項指標:

  • 首次繪製時間 - 標示瀏覽器開始轉譯內容的時間,也就是螢幕上的第一部分內容。
  • 首次顯示內容繪製時間 - 標記瀏覽器從 DOM 轉譯第一個內容、文字、圖片等作業的時點。

請參閱「運用最能影響使用者體驗的效能指標」一文,瞭解如何追蹤這些指標,以及如何利用這些指標改善您的體驗。

CSS font-display 屬性

網站字型能讓您加入豐富的字體排版功能。不過,如果使用者還沒有字體,那麼必須下載該字型,可能會導致網站顯示速度變慢。

幸好,如果字型下載時間過長,大多數瀏覽器都會使用備用選項。新的 font-display 屬性可讓您控制可下載的字型在完整載入前的呈現方式。

  • auto 採用使用者代理程式採用的字型顯示策略。
  • block 可讓字型有較短的區塊句,以及無限的替換期間。
  • swap 可讓字型出現零秒區塊句號和無限的替換期間。
  • fallback 提供字型極小的區塊期間和短暫替換期間。
  • optional 可讓字型採用極小的區塊期間和零秒交換期。

Chrome 60 和 Opera 均支援這項功能,且目前在 Firefox 中仍處於開發階段。 詳情請參閱「使用 font-display 控製字型效能」。

WebAssembly

Web Assembly 或 wasm 提供新的程式碼執行方式,能以近原生的速度執行以 C 和 C++ 等語言編寫的程式碼。

它提供建構瀏覽器內影片編輯器所需的速度,或運用現有的標準式網路平台 API,以高畫面更新率執行 Unity 遊戲。

您可以在 webassembly.org 中找到更多資訊,包括示範、說明文件和開始使用的方法。

還有更多獎品等著您!

  • 全新的 WebBudget API 可讓具有「推播通知」權限的網站傳送少量的推播通知,這些訊息會觸發背景工作 (例如同步處理資料或關閉通知),而不需要向使用者顯示可見的通知。
  • PushSubscription.expirationTime 現已推出,可在訂閱到期時通知網站。
  • 現在支援物件休息和傳播屬性,可以更輕鬆地合併和淺複製物件,並實作各種不可變更的物件模式。

注意:Payment Request API 已推送至 Chrome 61。

以上僅列出 Chrome 60 中專為開發人員設計的其中幾項變更,

接著訂閱我們的 YouTube 頻道。每當我們推出新影片時,您會收到電子郵件通知。

我是 Pete LePage,當 Chrome 61 推出後,我會馬上通知您,也就是 Chrome 的新功能!