The Disappearing Difference between Web and Native Applications

Does your business need a web app, native app, or both? The triplicate costs of developing and maintaining separate applications for each platform – Web, iOS, and Android – make this a high stakes question for any business invested in engaging digitally with its customers. And yet the technological landscape against which one might analyze this question is changing so rapidly that many businesses may choose the wrong product strategy based on outdated information.

 

So goal of this post clarify the difference between web and native apps as of July 2017.    

 

Case Study – Twitter

 

In February 2017, Twitter began redirecting all of its mobile web traffic from its native app to its new Progressive Web App (PWA), dubbed Twitter Lite, with the goals of increasing user engagement, achieving near-instant load times, and decreasing data consumption.

 

  • 65% increase in pages per session
  • 75% increase in Tweets sent
  • 20% decrease in bounce rate

 

<blockquote class=”twitter-tweet” data-lang=”en”><p lang=”en” dir=”ltr”>Today we moved all of Twitter&#39;s mobile web traffic (that&#39;s like, a lot) to our new web stack – Node.js, Express, React PWA.</p>&mdash; Nicolas (@necolas) <a href=”https://twitter.com/necolas/status/829128165314306048″>February 8, 2017</a></blockquote>

<script async src=”//platform.twitter.com/widgets.js” charset=”utf-8″></script>

 

Twitter Lite now uses only 3% of the local storage required by Twitter’s native app, and it requires only 600kb in bandwidth consumption for the initial load, as opposed to the 23.5MB required to download Twitter for Android. Learn more from this Google blog post.

 

To better understand how Twitter’s web app is able to achieve such significant advantages over its native app in terms of performance and data consumption, you need to understand the PRPL pattern, a web app architecture that has become possible over the past five years because of increasing browser support for the Service Worker and HTTP2, the latest version of the Hypertext Transfer Protocol. (We discuss HTTP2 at length in this article here).

 

Native app features that are now achievable on the web include:

 

 

As new browser updates roll out over the coming months, a host of new device hardware features will become accessible to web apps, further diminishing any advantage native apps may have may over PWAs. These forthcoming APIs will expose access to:

 

 

Advantages of progressive web apps over native apps:

 

Advantages of progressive web apps (PWAs) over native apps:

 

  • contacts, calendar and browser bookmarks access (lack of access to these could be viewed as a feature by privacy-conscious users)
  • alarms
  • telephony features – intercept SMSes or calls, send SMS/MMS, get the user’s phone number, read voice mail, make phone calls without the Dialer dialog
  • low-level access to some hardware features and sensors: flashlight, atmospheric pressure sensor
  • system access: task management, modifying system settings, logs

See the Pen Grab The GPS Location In Browser JS by Weft Digital (@weft_digital) on CodePen.light

See the Pen html 5 Vibrate Api by Weft Digital (@weft_digital) on CodePen.light

See the Pen Device Orientation API by Weft Digital (@weft_digital) on CodePen.light

See the Pen JS Battery Status API by Weft Digital (@weft_digital) on CodePen.light

See the Pen Compass in HTML5 Demo by Weft Digital (@weft_digital) on CodePen.light