#pwa #webapps #development #google

Brief Overview on Progressive Web App Development

Progressive Web Apps (PWAs) are a fairly recent trend in web and mobile app development. Coined by Google engineer Alex Russell in 2015, the term refers to web applications that use “progressive” design approaches in order to behave and function similarly to native apps. What that specifically means may not be perfectly clear, as there is no precise definition of what does or does not make a progressive web app.

ScaleTech Solutions
6 min readMar 3, 2022
Photo by Christina @ wocintechchat.com on Unsplash

However, there are some defining characteristics that are indicative of PWA design patterns. These include the use of ServiceWorkers (background scripts that run in the browser in order to provide features like push notifications) and app manifests (standardized JSON files that instruct the platform how to install and manage your app). There are also several common design themes that are often pointed to as being unique to PWA.

Benefits and Drawbacks of PWA

Employing progressive web app technology in an application’s development has many benefits, though there are also some drawbacks to consider. The main benefit of PWA design is that it is mostly platform-independent. This means that an app can be developed using a single codebase and deployed on several different platforms.

Simplifying the development in this way reduces the time and resources necessary to get an app to market. Platform independence combined with the fact that PWAs are inherently installable makes an app’s rollout onto multiple platforms easy. Users can download and install PWAs just like they can with any native app, rather than relying on a browser to access them, making the user experience seamless and intuitive.

PWAs also enjoy the benefits of modern website design in that they are responsive and lightweight. Modern web browsers allow developers to take advantage of design options that react to changing platforms and screen sizes to give users a consistent experience. The codebases of these modernized apps are smaller and their ability to run in a browser (rather than as a native app) makes them lightweight. An added benefit of PWAs as distinct web apps is that they are discoverable by search engine indexing.

However, the major drawback to PWA design is that there are some limitations on platform and hardware support. Since PWAs run in a browser, they do not have direct access to all of the capabilities of a platform that a native app built using a platform’s SDK, would have access to. Some platforms also have restricted support for these apps, though support and capabilities are constantly evolving.

Why Use PWA?

Ultimately using PWA design in an application is for those who want to get an app in the hands of users quickly and affordably. This design is great for early-stage startups with limited funds who want to get an MVP app to market as soon as possible. But any company wishing to take advantage of an evolving trend in modern app development will also see similar benefits from PWA.

BIG BRANDS THAT USE PWA

PWAs are not just meant for small companies and cash-strapped startups. On the contrary, many global corporations are seeing tremendous results from switching to a PWA strategy for their users’ benefit. One major brand that raised a lot of attention by doing this is Twitter, which designed its Twitter Lite app with PWA in mind. Following the rollout of Twitter Lite, Twitter saw a 75% increase in tweets, a 65% increase in pages per session, and a 20% decrease in bounce rate.

Forbes and Pinterest also designed PWAs for their businesses, with Forbes seeing a 43% increase in sessions and a 100% increase in engagement. Pinterest’s PWA brought in a 44% increase in user-driven ad revenue. These are just a few examples of companies adopting PWA design in their apps among other recognizable brands like Uber and AliExpress who have done the same.

PWA Compared to Other Technologies

PWAs are most easily compared to either native apps or web apps, existing somewhere in between the two. But there is a long list of specific technologies that lie on the spectrum between web and native which can also draw comparisons to PWA.

PWA VS NATIVE APPS

Comparing PWA directly to the general definition of native apps unveils a few differences. Namely, PWAs are built with lighter and simpler codebases (requiring only web languages rather than platform-specific SDK frameworks).

PWA VS CROSS-PLATFORM APPS

When compared to more hybrid technologies like React Native, PhoneGap or Flutter, there are certain details to highlight for cross-platform apps. For instance, React Native is made for building cross-platform native apps and achieves that with a single codebase, however usually it requires a broader skillset from your development team as they have to deal with various native controls and plugins which are written in different languages like Java or Objective-C (depends on the platform).

PhoneGap apps are somewhat similar as well. These are just web apps that are wrapped in a native container, which has access to various platform APIs through a set of native plugins. Despite the huge list of available plugins, you might need something custom and will have to implement it on your own, again with the help of Android and iOS developers.

PWAs are much simpler in this sense and are usually built just in JavaScript, utilizing modern frameworks like React, Angular, and Vue.

To sum it up, the PWAs most closely resemble the hybrid apps built with other cross-platform technologies. PWAs most likely will be cheaper in terms of development and future support, as you might need a smaller team without any specific or unique skills. The downside to PWAs is that they are limited by browser capabilities and may have poor support of some core features required for your app.

PWA VS WEB APPS

When compared to pure web applications, PWAs show several advantages. This is because web applications are strictly limited by the capabilities of the browser. That also means web apps do not offer the kind of installability that makes a PWA so convenient for users. While they can offer similar benefits, such as the responsive and lightweight design seen in many single-page applications (SPA), the key differentiator is a PWA’s standardized approach to simulating the native experience.

PWA can also be compared to application frameworks like Electron and Flutter. Electron is strictly a web app framework with disadvantages in application size and security that make it generally unsuitable for PWA development. But Flutter is more similar to PWA. Both PWA and Flutter emphasize development in a single codebase with cross-platform native functionality. However, Flutter only uses the new Dart web language whereas a PWA can be written in any language, with many older languages offering more support.

What to Expect of PWAs in 2022?

The bright side is that there are some significant improvements in the PWA market. One recent positive development for PWAs is a partnership between Microsoft and Google. Microsoft recently announced that PWABuilder will be using Google’s Bubblewrap technology. PWABuilder is Microsoft’s development tool that makes writing PWAs easier and Bubblewrap helps developers package their apps for distribution on the Google Play app store.

This announcement came along with the introduction of support for new features including native app shortcuts and advanced Android features now available through PWABuilder. The collaborative efforts of tech giants like Google and Microsoft are extremely promising for the future of PWA adoption.

Should you use PWA in 2022 and beyond?

The answer is YES if your product strategy requires fast market entry and coverage of multiple platforms with a single codebase. Progressive web apps allow startup companies to quickly and easily develop and distribute a progressive web app and benefit from the minimal time and money needed to roll out the app in the case of limited resources. Encouraging first-time users to revisit the application and getting them engaged with the help of push notifications and in-app banners make PWAs a powerful tool for marketing strategy implementation.

Larger corporations can also benefit from providing value to their users with limited access to high-performance platforms or who prefer a more streamlined, lightweight experience. PWA can be a choice for the development of enterprise software tied to a selected single platform to benefit from the important native features supported exactly by this platform.

Other frequent use cases for PWA are when your application requires the support of offline mode, or you need your legacy web application, for example, made with React, to be remade into PWA with minimal time in comparison to building a new app from scratch, for example, in Flutter for Web.

--

--

ScaleTech Solutions

We engineer the solutions to the problems that our customers want to address with their unique products/services.