Progressive Web App

Cards (19)

  • Progressive Web Apps (PWA)

    A PWA is a web app that leverages special browser capabilities that enable the app to act more like a native app when running on capable browsers.
  • The launch of the iPhone in early 2007 changed the way the world viewed the mobile phone, but it was the iTunes App Store introduced a year and a half later that brought transformative change.
  • For the first time Apps could surprise and delight. They were simple but never skimping on the details. They were sticky, causing the user to return more often, and they
    were only ever an arm’s length away.

    They were also coded natively
  • 3 Major Options for providing functionality to mobile phones:
    1. Website
    2. Application
    3. Natively Coded 
  • A website which is responsive or formatted for mobile, serving content from the Internet accessed via a browser on the mobile phone. 
  • An application developed using a web technology layer such as HTML, CSS and JavaScript that is downloaded as an App to the phone (e.g. PhoneGap, Cordova). Usually this web-tech layer still needs to talk to the native layer provided by the operating System. 
  • Natively coded applications (Native), in the case of iOS in Swift and Android most likely Java or Kotlin, which is  downloaded as an App to the phone. 
  • Three more specific options along the spectrum of Web-Native, which are:
    1. Packaged Hybrid (Web-Served)
    2. Hybrid Web (Middle Web-Tech Framework)
    3. Hybrid Mixed (Native Hybrid)
  • Package Hybrid (Web-Served)

    Consists of a native shell, maintained by a third-party vendor, running your web app within the shell. We use this option if the app needs to access the device’s capabilities, such as GPS, calendar, or photos.
  • Hybrid Web (Middle Web-Tech Framework)

    Built using mobile web standards that run inside a very thin native shell. We use this option if the app needs access to the device’s capabilities or the app store is needed to distribute a custom-branded app.
  • Hybrid Mixed (Native Hybrid)

    Similar to hybrid web, but more code is written natively, taking advantage of the device’s features and capabilities. We use this option to deliver one or two screens with complex user interactions that work on old and new devices.
  • Developers build PWAs primarily using two technologies available in most modern browsers:
    web app manifest files ; and service workers
  • There is no standard or standards that govern how PWA is made or how it works. It is just a web app built to act a certain way.
  • In 2015, a designer named Frances Berriman and a Google Chrome engineer named Alex Russell coined the term Progressive Web Apps.
  • Google says that PWAs are:
    • Reliable
    • Fast
    • Engaging
  • These terms describe a user’s perception of an app, not anything about how the app is built, what technologies it uses, or what it can do.
  • Characteristics of PWA
    • Are installable from the phone platform’s public app store
    • Will load and operate regardless of whether the device has network connectivity.
    • Can run in the background
    • Can receive push notifications
    • can even deliver a rich and robust offline experience
  • In early 2019, Google announced Trusted Web Activity (TWA) for Android. TWA enables developers to bundle a PWA into a native mobile app for Android.
  • Transport Layer Security (TLS)