List
of Abbreviations

API: Application Programming Interface

We Will Write a Custom Essay Specifically
For You For Only $13.90/page!


order now

HTTPS: Hypertext Transfer Protocol
Secure

IOS: iPhone Operating System

JSON: JavaScript Object Notation

PWA: Progressive Web Applications

URL:   Uniform Resource Locator

 

 

 

Introduction

A PWA is a web application that is enhanced with some technologies
that allow for native-like behavior in a mobile device, while still functioning
in a desktop browser. PWAs are initially served from a remote web server
similar to mobile web applications, but can when visited through a browser
application be installed on devices as well. Another core feature they have is
that they can be used regardless of network availability with the help of
service workers that, among other things, enables caching and preloading
resources. PWAs aim to bridge the gap in user experience between web and
native/hybrid applications. It can be added and launched from the home screen
and should load instantly, regardless of the network connection. This is
possible with the help of Service Workers, a JavaScript Worker that allows caching
content for offline access and for push notifications.

Progressive Web applications are meant to provide the
users with the same or even a better experience than a platform-specific
application would. The key principle is following the idea of progressive
enhancement, which effectively means utilizing APIs and features even though
they do not have a 100% support across browsers, but not relying on them for
the core functionality of an application. Many companies are facing the problem
of developing different applications for different platforms. They often need
to develop two mobile applications, one for iOS and one for Android. On top of
that, they need a web application that works well on both a desktop and a
mobile device (Cordova, 2015). Web applications
are somewhat limited today when compared to native mobile applications, but are
moving forward all the time. The challenge however is that progressive web
applications are yet to be included in the application market places where
people search for new applications. This can be mitigated by creating a new
application market place for PWAs such as PWA rocks or by packing the PWA into
a native application using an automated tool that extracts all information from
the web app manifest. Specifically, Windows App Studio or a tool called PWAify
comes in handy in such a case. Jacob Rossi from Microsoft has stated that he
“expects PWAs to be listed in the Microsoft store right alongside native
application in the future. It is against this background that this paper soughs
to establish the impact of progressive web applications in development of
mobile applications.

 

Requirements for a PWA

A progressive application has three requirements that
need to be fulfilled. Firstly, it needs to be served over HTTPS. Hypertext
Transfer Protocol Secure (HTTPS) denotes a protocol where http pages are sent
with an encrypting transport layer security (Zayas-Cabán, 2010).Transport layer security improves the
security of transferring web pages over a computer network such as the internet
by preventing man-in-the middle attacks. Man-in-the-middle attacks can be
achieved by someone spoofing the identity to act as intended receiver between
two communication parties. Secondly, PWA also requires web application
manifest. A web application manifest is a JSON-based document for specifying
metadata about a web application (Thompson, 2004).With manifest files developers are able
to specify if a web application should be opened in full screen mode, have a
custom color at the address bar and set which icons it should use when saved on
devices’ home screens. Thirdly, PWAs require service workers which are client-side
proxies between a web page, browser and if available a network (Abaidoo, 2014)Service workers
consist of JavaScript files with event-driven scripts that can be executed in
the background of a web page. Service worker can do some predefined actions
such as caching and preloading resources and returning custom responses to
requests.

Methodology

2.0
Method

In this chapter there will be a
description of the scientific method that was used in order to answer the
question on the impact of progressive web applications in development of mobile
applications.

2.1
Scientific Approach

A qualitative literature study was made. This decision
was made to find out what a web application, specifically a progressive one,
can do today in terms of native-like behavior. The review was undertaken to
determine if a PWA can match a native application in terms of response time
when accessing hardware.

2.2
Method Description

A search was made with a set of
keywords: Progressive Web Applications, access hardware. The information
gathered from the search results was summarized. The focus of the study was on
Alibaba.com which the largest online business-to-business trading platform
which serves over 200 countries and regions. There is also focus on Konga which
is a leading e-commerce website in Nigeria, selling everything from books to
fridges to mobile phones. Mobile devices provide the largest source of traffic
and user growth.

2.2.1
Progressive Web Applications

The applications containing the
PWA benchmarks were written in the JavaScript programming language with the
help of the React library. Visual Studio Code was the development environment
of choice for developing the applications.

Literature
review

The mobile Web is becoming ever more capable of
accessing and handling features previously only available in native and
cross-platform apps. With the advent of Progressive Web applications, regular
Web sites can to a larger extent than before act, feel and look as any other
installed application specifically on an android based mobile device (LePage, 2017)This is enabled
through a set of new concepts and requirements, advocated by Google as
well-worth implementation efforts (Majchrzak, January,2018).Precisely, a PWA is
any website implementing certain speci?c technical features making it possible
for it to be added to the home screen of a user’s device and used of?ine. It
looks like a regular app although being run inside a stripped-down Chrome browser,
which hides all its interface artifacts.

PWA is different from regular web sites and native or
cross-platform mobile applications due to its added functionality and user
experience (LePage, 2017).For instance, a regular website
requires the user to open a browser, type in a URL and wait for all content to
be downloaded on every visit, effectively preventing an offline experience, a
PWA only requires these steps for the first visit. After a home screen
installation, all necessary static ?les, including HTML, JavaScript, images and
fonts for the Web site, are now stored on the user’s phone, ready to be used
of?ine (Google Developers, 2017).All dynamic data can
be cached for of?ine (or low-connectivity) use, and re-fetched when needed,
e.g. when new data is available and the phone is on a decent network
connection. Where a regular Web site would be wrapped in a browser (e.g. Chrome
Android) with visible browser artifacts (such as address bar and menus), a PWA
will similarly run in a browser instance, but with those artifacts (LePage, 2017).Thus, a PWA will
look similar to a regular app. If a PWA is styled correctly, following the
design guidelines of each mobile platform, telling apart a regular native or
cross-platform app and a PWA from the appearance would be challenging.

Practitioners and the industry continue to put efforts
in implementing PWA characteristics into their websites though little progress
within the academia has been recorded. The academic contributions identi?ed are
few in number. (Malavolta et al, May,2017) Makes an interesting
contribution discussing energy ef?ciency of Progressive Web Apps, and the
energy impact of Service Workers. Their research revolves around measuring the
energy consumption using different devices and scenarios. Further research has
also shown that progressive enhancements improve the load times in single page
web applications. Techniques such as code splitting improve page loads and
together with offline caching of content with service workers make a PWA load
faster even on flaky connections. (Charkaoui,
2014)Provided
an insight into cross-platform development of mobile applications in their
paper Cross-platform mobile development approaches, where ? JavaScript frameworks were one of the approaches
discussed (Cordova, 2017).The web has moved forward
since this paper was published. For example, it states that a web application
cannot access the Device API of a mobile device, which is not true, anymore (Heitkötter, April,2012).Some features are
available to a web application today, such as camera, recording media and file
access. This makes this research interesting today.

According to (Archibald MacLeish, 2016) (Cordova, 2015)(2016), “Web apps are cheaper to develop
and deploy than native apps”. In their paper ? Mobile Application Development: Web vs. Native from 2011, they
state the not so controversial fact that native applications are faster
and have better user experience than web applications on mobile devices. They
further talk about PhoneGap, a  framework
for building native mobile applications with web technologies, and how it have
bridged the native and web environments, allowing web applications to live in a
native environment. The rundown is that the web has not achieved the level of
performance that native code provides, but it is getting close, giving the
example of Quake 3 running in the browser (Archibald, 2016).

In 2016 Jan Steczko wrote a thesis about companies
experiences with cross platform development compared to native development for
mobile devices. Steczko interviewed 13 businesses in order to answer his
problem. The paper concludes that the companies preferred native development
and that the advantages are stronger for native development. The companies
thought that  native applications were
faster and could provide better user experience, and  this compensates for the fact that creating
two different applications for the mobile and the web are more expensive in
both time and money. But the companies did also know that they could create
cross-platform applications with lower cost and the development of these
applications would be faster and simpler. According to Steczko’s research, the
choice between these two application strategies depended on several factors.
For example, complexity of the application, budget or quality (Roy-Chowdhury, 2017)

Findings
and Observations

Large companies and key players in
the mobile-Web space have already started converting their existing Web apps to
PWAs with great success. This includes Alibaba and Konga both leading companies
within their ?elds. Below is a case study of Alibaba with progressive web
application.

Alibaba.com increases conversions on the mobile web by 76% with Progressive Web App
Introduction
Alibaba.com is the world’s
largest online business-to-business (B2B) trading platform, serving 200+
countries and regions. After upgrading their site to a Progressive Web App
(PWA), they saw a 76 percent increase in total conversions across browsers.
Challenges
Building great mobile experiences is an indispensable part of
Alibaba. com’s success. The mobile web is their primary platform for
discovery on mobile, so they’ve always focused on design and functionality.
They found it difficult to build an engaging experience for the mobile web,
however. They looked at the mobile web as a platform to shift non-app users
to the app, but many preferred to stay within a browser. “Users consider
having to download an app to browse or complete a transaction an unnecessary
barrier, compared to the quick, easy solution of browsing directly from their
mobile browser” says Zou Yu, director of Alibaba.com’s mobile team.
Solution
Alibaba.com recognized that to build an effective mobile
presence, they needed to understand how two different user segments—native
app users and mobile web users—interacted
with their business. They wanted to deliver a great user experience for both
first-time visitors (in the hopes of re-engaging them) and repeat visitors
(who are more loyal to the site). Alibaba.com built a PWA that led to a fast,
effective, and reliable mobile web experience. The new strategy delivered a
76 percent increase in total conversions across browsers. (A conversion
corresponds to visits that result in direct contact with a supplier.) For
mobile web users on Android, Alibaba.com integrated features that helped
users re-engage with the site. The company implemented an “Add to
Home Screen” prompt, which resulted in users re-engaging four times more
often than other mobile users. They also noticed that re-engagement on the
web was comparable to that of their native app. For push notifications, the
open rate on the mobile web is the same as that on the native app.
The new strategy also delivered a much better user experience
across platforms. The investment in the mobile web increased monthly active
user rates on iOS by 14 percent. On Android devices where re-engagement
Capabilities like push notifications and Add to Home Screen
were enabled, active user rates increased by 30 percent. ” Delivering a
mobile-first, user-centric mobile site that harnesses the best of the native
app, with all the accessibility and versatility of the mobile
web, is key to maintaining our competitive edge and the path to better
conversions,” Zou Yu says.
 
 
 
 
 
Konga cuts data usage 92% with new
Progressive Web App
Company
Launched in 2012, Konga is a leading e-commerce website in
Nigeria, selling everything from books to fridges to mobile phones. Mobile
devices provide the largest source of traffic and user growth.
Challenge
Africa is a uniquely mobile continent. Unlike many other parts
of the world, Internet use leapfrogged over desktop to mobile. Poor
connectivity, the prevalence of low-end devices, and several other obstacles
hindered Konga’s ability to grow. They developed a native app, so users on
mobile could work offline and re-engage.
The cost of Internet access is still high, however, while
per-capita income is relatively very
low. Current and potential customers are very data-sensitive, and many
hesitated to use data or space to download Konga’s native app.
Solution
Konga wanted to provide all of their web users with the
benefits of their app, including performance, the ability to work offline,
and re-engage without the data cost. They built a Progressive Web App to
leverage new, open web APIs and offer a mobile web experience that is fast,
uses less data, and re-engages users in multiple ways.
With nearly two-thirds of Nigerian users reaching the Internet
via 2G networks, a fast user experience was essential. To decrease load
times, Konga added service workers and streamlined the site to help consumers
quickly reach the products they’re looking for. Users can continue to browse
categories, review previous searches, and even check out by calling to order—all
while offline.
Tracking data usage to initial load and to complete first
transaction were two key measurements for Konga. Compared with their native
app, their Progressive Web App uses 92% less data for initial load and 82%
less data to complete the first transaction. Also, when compared to their
previous mobile web site, the new experience uses 63% less data for initial
load and 84% less data to complete first transaction.
“We estimate that with our new light, super-fast, UX-rich
browsing capability, customers’ data
consumption will fall dramatically,” says Shola Adekoya, Konga.com CEO.
 
 
 
 
 

Source: (Developers, 2017))

 

Observations

From the case study of Alibaba.com it is evident that
progressive web application has led to Alibaba.com built a PWA that led to a
fast, effective, and reliable mobile web experience. The new strategy delivered
a 76 percent increase in total conversions across browsers. For mobile web
users on Android, Alibaba.com integrated features that helped users re-engage
with the site. The company implemented an “Add to Home Screen” prompt, which resulted in users
reengaging four times more often than other mobile users. They also noticed
that re-engagement on the web was comparable to that of their native app. For
push notifications, the open rate on the mobile web is the same as that on the
native app.

For Konga, they built a Progressive Web
App to leverage new, open web APIs and offer a mobile web experience that is
fast, uses less data, and re-engages users in multiple ways. Konga added service workers and streamlined
the site to help consumers quickly reach the products they’re looking for.
Users can continue to browse categories, review previous searches, and even
check out by calling to order all while offline. Also, when compared to their previous mobile
web site, the new experience uses 63% less data for initial load and 84% less
data to complete first transaction.

 

 

 

 

 

 

 

 

Recommendations

Progressive Web Application PWA has led to a fast,
effective, and reliable mobile web experience than a Native Android Application. There is therefore
need for developers to engage with PWA since it is catching up with native
applications on mobile devices. More research is needed on this topic. There is
need for more extensive testing since the Android eco system of mobile devices
is a wide landscape.

Moreover, including iOS in future
research like this one could also be a good choice. Even though iOS does not
support many of the features that make up a PWA such as offline support and the
ability to add it to the home screen. One could also compare the performance of
a PWA with mobile applications built with tools that allow developers to use
web technologies when developing native applications.

 

 

 

 

 

 

 

 

 

 

 

 

REFERENCE

Apache
Cordova. (2015). Retrieved January
2018, from The Apache Software Foundation: https://cordova.apache.org

Abaidoo, B. &. (2014). Consumer health
informatics: the application of ICT in improving patient-provider partnership
for a better health care. Online journal of public health informatics,
6(2).

Archibald MacLeish. (2016). Mobile
Application Development.

Charkaoui, S. &. (2014). Cross-platform
mobile development approaches. In Information Science and Technology (CIST),
2014 Third IEEE International Colloquium in , 188-191.

Cordova. (2015). The Apache Software
Foundation. Retrieved January 2018, from Apache Cordova. :
https://cordova.apache.org.

Cordova. (2017). Retrieved January 2018,
from http://cordova.apache.org/..

Developers, G. (2017). Case Sudies|2017.
Retrieved January 2018, from developers.google:
https://developers.google.com/web/showcases/2017

Google Developers. (2017). Progressive
Web Apps. Retrieved January 2018, from Developers.google.

Heitkötter, H. H. (April,2012). Evaluating
cross-platform development approaches for mobile applications. In
International Conference on Web Information Systems and Technologies,
120-138.

LePage, P. (2017). Your first progressive
web app. Retrieved January 2018

Majchrzak, T. A.-H. (January,2018).
Progressive Web Apps:the Definite Approach to Cross-Platform Development? In
Proceedings of the 51st Hawaii International Conference on System Sciences.

Malavolta et al. (May,2017). Assessing the
Impact of Service Workers on the Energy Efficiency of Progressive Web Apps.
2-20.

Roy-Chowdhury. (2017). The mobile web:
State of the union. Retrieved January 2018, from
https://www.youtube.com/watch?v= ssDaecATCM.

Thompson, T. G. (2004). The decade of health
information technology:delivering consumer-centric and information-rich health
care. Washington, DC: US Department of Health and Human Services.

Zayas-Cabán, T. &. (2010).
Considerations for the design of safe and effective consumer health IT applications
in the home. Quality and Safety in Health Care, 19(Suppl 3), i61-i67.