I am overwhelmed with information right now. Day one of Google I/O 2017 had so much in store about mobile web and especially on Progressive Web Apps, that Google IO 2017 was truly worth the wait. The amazing new capabilities, clearly show that web is the future. Believe it or not, 5 Billion devices are connected to the web. Chrome alone runs 2 billion devices for phone, tab and laptop!
Here is a sneak- peek into Google I/O 2017, Day One –
Why build Progressive Web Apps?
-Web reaches 3X more people.
– Deeply engaging experiences from first touch point
In 2011 Financial Times abandoned native apps and build a PWA and have never looked back ever since.
– 43% increase in session duration
– 3X in scroll depth due to personalization
– 100% more engagement
In this era, the audience is as knowledgeable as they can be and there exists an never ending need for them to be understood by brands.
After using PWA, Forbes witnessed 43% increase in session per user and 100% increase in session duration. Which is double the length on average!
Google I/O 2017 – What’s new ?
Improving add to home screen feature
Initially, web apps could only be added to the mobile homescreen. Now is is possible to add it in other parts of the android system, like the app drawer and system settings, just like native apps.
“Users will be able to find web apps in many places that were formerly reserved just for apps.” said Sam Birch, Product Manager, in the Google I/O 2017.
PWA now provides users with a splash screen experience, just like native apps. It no longer displays any element of chrome once the web app is opened. Now, intends can be handled on other apps as well and not only on chrome. The toolbar saw some improvements, supporting the jumping back, carrying and opening a Chrome tab.
Conservative approach in sending notifications as not to seem pushy and spammy. This was welcomed with a 48% more engagement level. The magic mantra being few minutes + couple of visits.
The whole point was to show the prompt later when the user is engaged and is willing to take any step towards favouring you. Flipkart delayed prompting until user made a purchase, a moment where the user is satisfied from their service.
As soon as chrome realizes the site you are visiting is a progressive web app, it fires a prompt before the install.
If you have visited the event earlier on this page, the defaults prompt will be suppressed and trigger will follow with the user action.
PWA on desktop?
Yes, you read it right. It is officially announced in the Google IO 2017, that PWA will now slowly spread its tentacles onto larger screens with Chrome Android. Once the PWA is added to the desktop, a new shelf item is created and one opened, it turns to be a stand alone item, with a splash screen.
Samsung internet web app
The bookmark option that we very well know, will automatically turn into a ‘+’ sign once Chrome recognizes it as a PWA. Tapping on the + button, will provide 2 options – Bookmark and Add to the home screen.
PWA in Windows play store
Because it is partially app too you know! Microsoft Edge in the Build Conference announced that progressive web apps will soon be in their app store. Like any other app, PWA finds its way to the app store, making it easier for the users to search for it directly from the app store, install and uninstall like a regular app. A live demo was showed in the Google IO 2017.
Web apps standard based standard feature like push notifications can follow you to whichever browser you follow on your android.
You can test all these on your site with the flag for now – chrome://flags#enable
Ola riding towards progress
Ola, India’s largest ridesharing service, is using PWA. It gets 1 million rides daily, active in 110 cities and has over 600K drivers.
The time that take the Ola PWA is 1 – 3 seconds. It fetches only those components that are essential when the user opens it. Fetching happens in the background simultaneously in the background to make things snappy, Once all the components are loaded, repeat load time stays under a second.
This solves the issues related with networks and uses low data. After using PWA, the mobile traffic has accelerated to 63%, expanding the reach. It is also an amazing way to re target users, as 20% of PWA booking are from users previously uninstalled the app.
One of the reasons why PWAs are successful is that, multiple browsers are committed to them. “If a browser you care about is not on the list supporting PWA…yet, PWAs are designed to work well everywhere.” said Rahul Roy Chowdhary, VP, Product Management Google, throwing some hope to the iOS users.
Lancome has 65% mobile web uses on iPhone. Despite that a few PWA features are not supported by iOS, they receive an hike of 53% increase in session duration on iOS.
Payment API has made it easier and swifter for the user to fll credit card details and google forms. Now, it supports more forms of payment from various other forms of payment like the PayPal, Samsung Pay and Alipay, making your website support any payment app. $123 billion worth spent on mobile e commerce in 2016 and that’s only taking US into account.
70% of bytes of intent traffic is video. With PWA, videos as instantly played, prefetching the first few seconds of a video to enable instant payback. When the phone if flipped to a horizontal mode, it turns to full screen and has custom controls. Media properties appear even on the lock screen and also works in offline mode (Aeroplane mode) once it is saved to be watched offline.
It helps to track page performance, page efficiency, accessibility and gives a score between 0 – 100, showing where you are falling behind. Shows your offline score and how fast your website loads in flaky networks.
It enables to get the most out of the service workers. It can be integrated to the existing tools.It provides common patterns, best practices like flexible catching, backing sync or usage stats when the user is offline.
Accelerated Mobile Apps
A lot was talked about the capabilities of AMP in Google IO 2017. AMP provides content focused experiences for modern mobile webs. It is based on web components. On an average, a page loads less than a second to send 10 times less data. People are engaged better as they can access content faster.
Twitter, Tumbler, Welbo, QZone are linking to AMP. What more! AMP is also seeing success in Ecommerce to improve interaction and to create an engaging UX. Twitter lite links to AMP pages and uses less mobile data. 70% data saving for users on data saving mode.
This has personally happened to me many a times – the web page opens, I start reading the content and whoop, the page jumps! Not once but quite a few times as the off screen content loads. Now It time to bid goodbye to this irritating issue. With scroll anchoring, it locks down the scroll position to a visible element on the screen, so that the user stays in the same position when screen content is still loading.
After an amazing Day 2 of Google IO 2017, which was an knowledge package of its own. Looking forward to Google I/O 2017, day 2. PWA is doing wonders; things we thought were unimaginable. More power to Google I/O 2017! More updates your way.