Web applications are booming, we’re used to doing our jobs on computers, and with so many powerful online sites, our Windows desktops are no longer crowded with shortcuts. Not only is the PC terminal, in the mobile terminal we are no longer in the vast application market to install a variety of software, lightweight small programs have replaced their position, no installation point out-of-the-box way for everyone’s work and life has brought great convenience.

We understand this kind of change brings the convenience for us to live and work, but occasionally we will miss the surfing the web all over the desktop era of local application, double-click the desktop can run, don’t have to search in the open web page we need the function of the web page, even if broken network can still normal use, use speed on them seems to be faster than the web.

Now you may be thinking, what does all this talk have to do with PWA?

What is incremental Web Applications ( PWA )?

Introduction to Progressive Web App (PWA)Copy the code

PWA refers to Web applications developed using specified technologies and standard patterns that give Web applications the features and experience of native applications. For example, we think native apps are easier to use and more responsive.

With PWA, there are two benefits. On the one hand, the application development still adopts the way of Web development. We only need simple configuration to use it, and there is no need to make installation packages for various operating systems. The entrance of the application is still the Web page.

On the other hand, after an application is installed, users can use the desktop icon to quickly access the resources required by the application. After the first installation, the resources are cached offline and can be used offline. The system push can be used in real time.

For example, if you want to install a site that supports PWA in Chrome, click install in the address bar or click Install in the browser options.

PWAThe status quo

PWA was proposed by Google in 2016 and formally implemented in 2017, and ushered in a major breakthrough in 2018. The world’s top browser manufacturers, Google, Microsoft and Apple, have all announced their support for PWA technology. The key technology of PWA is Service Worker, which is currently supported by all major browsers on desktop and mobile devices. With the exception of Safari, all major browsers now support home screens and push notifications.

Here we briefly introduce Service workers.

The Service Worker acts as a proxy server location between the Web application, the browser, and the network, if available. The API is designed to create a better offline experience, intercept network requests and take appropriate action based on whether the network is available, and update content residing on the server. It also allows access to push notifications and synchronizes with backend apis.

PWAWhere are the usage scenarios and future of?

According to the PWA, you might ask, what’s the value of this thing?

Current data statistics show that PWA does not have much market in mobile terminals. On 3G, 4G and now 5G mobile terminals, a 100MB APP can be quickly removed. Except for flying, our mobile phones will never be offline.

On the PC side, we started working, and as long as you are still using Office and other Office software, you will realize the convenience of WPA is immeasurable. In the process of global informatization, our company is also in the process of continuous informatization. A variety of commonly used tools and software will become an integral part of the Web application. Such as online Excel, online report design, online Word and so on.

All of this, increasingly, has become associated with “online” and “web front end “.

Moving these applications into Web applications is not always easy. These tools are complex, resource-heavy, and often forgotten for workflow projects that require real-time feedback.

In online Excel alone, the difficulties of collaborative editing include and are not limited to multiplayer conflict handling, version data updates, room management, rich text processing, copy-paste processing, and more.

The figure below uses PWA technology to integrate the Excel table editor. For end users, the operating experience of Excel is completely retained. When multitasking, Alt (CMD) — TAB is used to quickly switch applications and the system level push is used to pay real-time attention to the working status. All of this can happen in our Web application, no native application required.

In the next part of this article, we will take a look at how PWA can turn a site into an APP.