In recent years, progressive Web apps have become a growing trend, driven by Web giants and mobile developers, as they allow native-like experiences to be brought to any platform.

Among the companies most committed to the new technology is Microsoft, which has helped Web developers embrace it through projects such as PWABuilder. With the launch of the first Chromium-based Version of Microsoft Edge and its recent announcement at Build 2020, the company aims to bridge the gap between native and Web applications by introducing exciting new features and apis.

So what are these changes and what do they mean for you?

PWA is a first-class citizen on Windows

The first set of changes concerns the way the PWA installed from Microsoft Edge interacts with Windows.

Until now, installing a Web application from Edge meant having an application that had an incredibly native feel, yet behaved strangely in some cases.

For example, they do not show up as separate applications in the Settings application or task manager, making them more difficult to manage, especially for less tech-savvy users. The Edge team did a virtual demo at Build 2020 to announce that in the upcoming browser version, PWA will be treated like any other application by Windows, all of which will be fixed soon.

In addition, installed web apps can be set as shared targets (that is, they will appear in the list of apps in the Windows Share dialog), request startup permission when the operating system starts, and set certain file types, urls, and protocols to default.

The new API

In addition to the changes designed to make PWA feel more native, the Edge team has released a new set of apis to make Web applications behave more like their native applications.

Customizable title bar

From a UI perspective, one of the most obvious drawbacks of PWA is their inability to customize their title bar when running on desktop devices.

In the upcoming Edge version, the new API should address this issue by allowing developers to extend HTML elements under the title bar.

This is especially useful for complex PWA because they can place tabs and search bars in the user interface without wasting valuable space.

Native file system access

Until now, websites were not allowed to save files in a specific location on a user’s device. This means that online photo editors require users to upload photos they want to edit and then download them to their device, whereas native photo editors simply give you the option to replace existing photos.

Starting with Edge 86 (version 83 is the latest version at the time of writing), developers will be able to replace all the files a user selects in a session, making productivity applications on the Web more useful.

The badge

We already know a badge will be added to the API application icon will appear in the browser based on Chromium, but now for the first time we see the whole picture, we can not only add with Numbers and icon badge to the PWA, we will also get a new event, is used to update the badge in the service thread. I find this concept of events very interesting because it introduces a lightweight alternative to push notification events.

While it may seem like a small UI tweak, I’m not going to dismiss it as a small change, as user studies have repeatedly shown that adding badges to app ICONS can dramatically increase user engagement.

Easy access to the Microsoft Store

Thanks to PWABuilder, it can already publish PWA to the Microsoft Store with minimal effort. The most relevant disadvantage of this approach is that the packaged Web application runs on the traditional Edge engine, not Chromium, so it can’t take advantage of some of the newly released apis.

In Build 2020, we found that all of this will change in a few months, when PWABuilder will allow packaged Web applications to run on Chromium.

The end of the

As a Web developer, I’m glad Microsoft is investing so heavily in progressive Web applications, because I think they are the future not only of Web experiences but also of mobile apps, and such capabilities make them a more viable alternative to native languages and frameworks.

If you’re as excited as I am about these improvements, I suggest you check out the list of suggested features for PWA being developed as part of Project Fugu, a cross-company effort from Google, Microsoft, and Intel that has brought us many of the aforementioned changes.


Original text: medium.com/swlh

By Samuele Dassatti

Wechat search [front-end full stack developer] pay attention to this hair loss, stall,Selling goodsContinuous learning programmers, the first time to read the latest articles, will be two days before the publication of new articles. Attention can be a gift package, you can save a lot of money!