- Chrome 63 可讓您動態匯入 JavaScript 模組。
- 有了非同步疊代器和產生器，我最喜歡的面試程式碼問題就變得輕而易舉。
- 您可以使用 CSS
overscroll-behavior屬性覆寫瀏覽器的預設溢位捲動行為。 - 另外，我們改變了使用者要求權限要求的方式
還有更多！
我是 Pete LePage，讓我們一起來看看 Chrome 63 版為開發人員提供哪些新功能！
如需完整的變更清單，請查看 Chromium 原始碼存放區變更清單。
動態模組匯入
匯入 JavaScript 模組非常方便，但它是靜態的，您無法根據執行階段條件匯入模組。
所幸，Chrome 63 版已改用新的動態匯入語法。可讓您在執行階段動態載入程式碼至模組和指令碼中。這項功能可用於在需要時延遲載入指令碼，進而提升應用程式效能。
button.addEventListener('click', event => {
import('./dialogBox.js')
.then(dialogBox => {
dialogBox.open();
})
.catch(error => {
/* Error handling */
});
});
您可擷取需要登入的資源，而不必在使用者首次造訪頁面時載入整個應用程式。初始載入量很小，且速度極快。接著，在使用者登入後載入其餘內容，即可順利進行。
非同步疊代器和產生器
使用 async 函式編寫任何類型的迴迭程式碼可能會很難看。事實上，這是我最愛的面試編碼問題的核心部分。
如今，有了非同步產生器函式和非同步疊代 協定，串流資料來源的使用或實作方式變得更為簡單，我的程式碼問題也變得更容易解決。
async function* getChunkSizes(url) {
const response = await fetch(url);
const b = response.body;
for await (const chunk of magic(b)) {
yield chunk.length;
}
}
非同步疊代器可用於 for-of 迴圈，也可透過非同步疊代器工廠建立自訂非同步疊代器。
超出捲動行為
捲動是與網頁互動最基本的方法之一，但特定模式可能不容易處理。舉例來說，瀏覽器的「滑動重新整理」功能會在頁面頂端往下滑動時，執行硬式重新載入。
先前，使用完整頁面重新整理。
之後，只重新整理內容。
在某些情況下，您可能會想覆寫該行為，並提供自己的使用體驗。這就是 Twitter 的漸進式網頁應用程式的運作方式，當您向下滑動時，系統不會重新載入整個網頁，而是直接將任何新推文新增至目前的檢視畫面。
Chrome 63 現在支援 CSS overscroll-behavior 屬性，可讓您輕鬆覆寫瀏覽器的預設溢位捲動行為。
這項工具可用來：
- 取消捲動連結
- 停用或自訂「拉動更新」動作
- 在 iOS 上停用橡皮筋效果
- 新增滑動導覽功能
- 以及更多應用程式...
最棒的是，overscroll-behavior 不會對網頁效能造成負面影響！
權限 UI 變更
我很喜歡網頁推播通知，但因為在沒有提供任何背景資訊的情況下，就在載入網頁時要求權限的網站數量，我感到非常困擾，而且我並不孤單。
90% 的權限要求都會遭到忽略或暫時封鎖。
在 Chrome 59 中，我們開始解決這個問題，只要使用者拒絕要求三次，就會暫時封鎖權限。在 m63 中，Android 版 Chrome 會建立權限要求的模式對話方塊。
請注意，這項功能不僅適用於推播通知，也適用於所有權限要求。我們發現，如果您在適當時間點和情境下要求權限，使用者授予權限的可能性會提高兩倍半！
還有更多獎品等著您！
當然，這只是 Chrome 63 中針對開發人員所做的部分變更，還有更多變更。
finally現已可用於Promise執行個體，並在Promise完成或拒絕後叫用。- 新的 Device Memory JavaScript API 可提供使用者裝置的 RAM 總量提示，協助您瞭解效能限制。您可以在執行階段調整體驗，減少低階裝置的複雜度，為使用者提供更優質的體驗，減少挫折感。
Intl.PluralRulesAPI 可讓您建構應用程式，藉此瞭解特定語言的複數形式，並指出哪種複數形式適用於特定數字和語言。並可協助處理序數。
請務必訂閱我們的 YouTube 頻道，這樣一來，我們發布新影片時，你就會收到電子郵件通知。
我是 Pete LePage，Chrome 64 一推出，我就會馬上在這裡告訴你 Chrome 的新功能！