From the course: JavaScript: Progressive Web Applications

Introduction to Progressive Web Apps - JavaScript Tutorial

From the course: JavaScript: Progressive Web Applications

Start my 1-month free trial

Introduction to Progressive Web Apps

“

- [Instructor] Today's modern browsers now support many features to address the shortcomings of native apps and hybrid frameworks. They can load content while offline and support standardized technologies like responsive design and web push notifications. On mobile devices, browsers support adding web apps to home screens. The result is an app-like experience, and this is what progressive web apps are all about. Progressive web apps, or PWAs, are websites that can be stored on a mobile device using new web technologies like web app manifests and JavaScript service workers. PWAs are responsive, they should load and present themselves in a variety of platforms and screen sizes, much like any other responsive website. PWAs are secure, in fact, one of the requirements of PWAs is that they must be served over HTTPS. PWAs are usable when no data connection is present. This works by caching necessary resources on the device when the app loads. PWAs are installable on the device. Users can choose to install the app on their home screen, much like any other app. Many browsers will prompt users automatically when certain interaction criteria are met. PWAs are cross-browser compatible, they work in multiple browsers that implement the PWA spec. You can visit the PWA checklist for more information. From a user's standpoint, PWAs are data friendly. A multi-megabyte native app download from an app store can usually be created using a fraction of the size. In addition, the install isn't necessary before users can interact with the app. A user can decide whether to install or not after they've used the app. From a developer's perspective, there are benefits as well. PWAs are easily updated. When new features or content are added, developers simply need to update the files on their servers. If set up correctly, the PWA will automatically download and install the new features on next launch. Sharing a PWA is extremely easy, it's a URL after all. Links can be embedded virtually anywhere, including on social media and in an email. No app store involvement is required for updates or sharing. In addition, PWAs include support for features like push notifications, allowing for increased user engagement. Of course, it's not all roses. The chief shortcoming of PWAs is that they are so new that the spec isn't yet fully developed. Developers are at the mercy of the browser and platform providers to implement the spec, and of course, the spec could change at a moment's notice. PWAs in their current form are predominately an Android technology via the Chrome browser. Firefox and Opera have largely joined the PWA bandwagon, and even Microsoft has begun supporting PWA technologies. The elephant in the room, though, is iOS. Simply put, as of today, much of the PWA spec isn't implemented in iOS, no matter which browser you use. Apple has pledged to implement the technologies, but so far, it doesn't look like they will implement the technologies in the same fashion. The best advice I can give you is to implement as much of the standard as you can today in the hopes that tomorrow what you've built will work universally. If you implement the features already present in a given platform, you will be in a better position than a developer starting from scratch.

Contents