[[347695]]

近年來，由于網絡巨頭和移動開發人員的推動，漸進式Web應用已成為一種增長趨勢，因為它們允許將類似原生的體驗帶入任何平臺。

在最致力于這項新技術的公司中，有Microsoft，它通過PWABuilder[1]等項目幫助Web開發人員擁抱了這一新技術。隨著第一個基于Chromium的微軟Edge版本的推出，以及最近在Build 2020上的宣布，該公司通過引入令人興奮的新功能和API，旨在彌合原生應用程序和Web應用程序之間的差距。

那么，這些變化是什么，對你意味著什么?

PWA是Windows上的一等公民

第一組更改涉及從Microsoft Edge安裝的PWA與Windows交互的方式。

直到現在，從Edge安裝一個Web應用意味著擁有一個令人難以置信的原生感覺的應用程序，然而在某些情況下表現得很奇怪。

例如，它們在“設置”應用程序或任務管理器中沒有顯示為單獨的應用程序，從而使它們更難管理，特別是對于不太精通技術的用戶。Edge團隊在Build 2020上進行了虛擬演示，宣布在即將發布的瀏覽器版本中，PWA將被Windows視為其他任何應用程序，所有這些將很快得到修復。

除此以外，安裝網絡應用還能夠被設置為共享目標(即它們將出現在Windows共享對話框的應用列表中)，在操作系統啟動時請求啟動權限，并將某些文件類型、URL和協議設置為默認。

新的API

除了旨在讓 PWA 感覺更原生的變化之外，Edge 團隊還發布了一套新的 API，讓 Web 應用的行為更像他們的原生應用。

可自定義的標題欄

從UI角度來看，PWA的最明顯的缺點之一是當它們在桌面設備上運行時無法自定義其標題欄。

在即將推出的Edge版本中，新的API應該可以解決這個問題，允許開發人員在標題欄下擴展HTML元素。

直到現在，PWA都不能像其原生版本一樣自由地自定義其標題欄

這對于復雜的PWA特別有用，因為他們可以在用戶界面中放置標簽和搜索欄，而不會浪費寶貴的空間。

原生文件系統訪問

到目前為止，不允許網站將文件保存在用戶設備上的特定位置。這意味著在線照片編輯器需要用戶上傳他們想要編輯的照片，然后下載到他們的設備上，而原生的照片編輯器只會給出替換現有照片的選項。

從Edge 86開始(83版本是寫稿時最新的版本)，開發者將能夠替換用戶在會話中選擇的所有文件，從而使Web上的生產力應用更加有用。

徽章

應用圖標徽章在各大操作系統上都有出現，現在是時候讓Web成為它們的一部分了

我們已經知道一個將徽章添加到應用程序圖標的API將出現在基于Chromium的瀏覽器中，但現在我們第一次看到了全貌：我們不僅能夠將帶有數字和圖標的徽章添加到PWA中，我們還將獲得一個新的事件，用于在服務線程中更新徽章的內容。我覺得這種事件的概念非常有趣，因為它引入了一種輕量級的替代品，用于推送通知的事件。

雖然看起來只是一個小小的UI調整，但我不會因為這只是一個小小的改變就不屑一顧，因為用戶研究已經多次證明，在應用圖標上添加徽章可以大幅提高用戶參與度。

通往Microsoft Store的簡便途徑

多虧了PWABuilder，它已經可以以最小的努力將PWA發布到Microsoft Store。這種方法最相關的缺點是，打包后的Web應用運行在傳統的Edge引擎上，而不是Chromium上，因此無法利用一些新發布的API。

在Build 2020中，我們發現這一切都將在幾個月后發生變化，屆時PWABuilder將允許打包的Web應用程序在Chromium上運行。

結束

作為一名網絡開發者，我很高興看到微軟在漸進式Web應用上投入如此之大，因為我認為它們不僅是網絡體驗的未來，也是移動應用的未來，這樣的功能使它們成為原生語言和框架的更可行的替代品。

如果你和我一樣對這些改進感到興奮，我建議你去看看作為Project Fugu的一部分正在開發的PWA的建議功能列表[2]，Project Fugu是谷歌、微軟和英特爾的跨公司努力，為我們帶來了許多前面提到的變化。

參考資料

[1] PWABuilder: https://www.pwabuilder.com/

[2] PWA的建議功能列表: https://bugs.chromium.org/p/chromium/issues/list?can=2&q=proj-fugu&sort=pri&colspec=ID+Pri+M+Stars+ReleaseBlock+Component+Status+Owner+Summary+OS+Modified&x=m&y=releaseblock&cells=ids

本文轉載自微信公眾號「前端全棧開發者」，可以通過以下二維碼關注。轉載本文請聯系前端全棧開發者公眾號。