Twitter Announces Their Progressive Web App (PWA) is in the Windows Store

twitter-scrabble-tilesFriday Twitter replaced it much neglected Windows native app with a progressive web app version. They are not the first app to leverage progressive web apps in the Windows store, but they are one of the first to have a public announcement.

Twitter announced last May at Google I/O it was launching Twitter Lite, a Progressive Web App (PWA) version of the twitter client.

At the conference they also shared some statistics from their intial trials:

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

These increased engagements numbers are not unusual. When you make an intentional effort to deliver a better user experience your customers they respond by giving you more attention.

twitter-windows-pwa-login

I have been using the Twitter PWA on my Android since it was released. It works great!

To be fair I would have used the twitter web client anyway.

The Twitter PWA Technicals

I decided to check out how Twitter implemented the web manifest and service worker. I was expecting to see a special home page references in the web manifest file. But that was not the case.

{ "background_color": "#ffffff", "description": "It's what's happening. From breaking news and entertainment, sports and politics, to big events and everyday interests.", "display": "standalone", "gcmsenderid": "49625052041", "gcmuservisible_only": true, "icons": [{ "src": "https://abs-0.twimg.com/responsive-web/web/ltr/icon-default.882fa4ccf6539401.png", "sizes": "192x192", "type": "image/png"} ], "name": "Twitter Lite", "orientation": "portrait", "share_target": { "url_template": "compose/tweet?title={title}&text={text}&url={url}" }, "short_name": "Twitter Lite", "start_url": "/", "theme_color": "#ffffff", "scope": "/"}

Three things stood out to me, the start_url, the gcm properties and the reference to the native Android app.

The start_url appends a querystring parameter to track when the app is loaded from the home screen icon. This will also trigger when the Windows app is launched. By doing this Twitter can track how often users launch Twitter Lite.

twitter-windows-pwa

The gcm properties work with the Google Cloud Messenger, the push notification service Twitter uses to let you know when a new tweet has been posted! Sorry I had to disable the feature, my phone would not stop bothering me.

They also serve a different site to mobile view ports than they do to desktops. I am not a fan of this, because responsive design works much better than adaptive design.

I think it will be interesting now they can collect desktop usage telemetry to the PWA on Windows. Hopefully they will migrate to a mobile first, responsive design.

The only feature missing, for me at least, is no dark theme. I love the dark theme.

The Service Worker

The service worker code has been uglified, which makes it a bit difficult to review. It is rather large and does pre-cache assets. I did notice there are multiple potential paths for the event handlers to be registered. Not sure how the descisions are made at this time.

It does import another script that performs the actual logic.

importScripts("https://abs-0.twimg.com/responsive-web/serviceworker/main.5b010ca933cac2bf.js");

There are over 6200 lines of code when you make it pretty! Insane amount of logic for the service worker.

Twitter's Nicolas Gallagher posted last April how they built the Twitter Lite PWA. Its a good read.

Summary

Twitter is not alone in releasing PWAs that can and should replace native apps. Pinterest and Starbucks are just examples.

Thousands of others are following suite. In fact the Edge team says they have identified over a million sites that qualify as progressive web apps already. Heck, I have been releasing several lately!

example-pwa-sites

By replacing the Windows native app with a Progressive Web App version Twitter is begining its effort to deprecate the large, disparate code bases of their native apps. You should expect Android and iOS to be replaced soon.

Share This Article With Your Friends!

We use cookies to give you the best experience possible. By continuing, we'll assume you're cool with our cookie policy.

Install Love2Dev for quick, easy access from your homescreen or start menu.

Googles Ads Bing Pixel LinkedIn Pixel