Measuring the Real-world Performance Impact of Service Workers
One of the most significant benefits of service workers (from a performance perspective, at least) is their ability to proactively control the caching of assets. A web application that can cache all of its necessary resources should load substantially faster for returning visitors. But what do these gains actually look like to real users? And how do you even measure this?
Ele.me improves performance load times with a multi-page Progressive Web App
Ele.me is the biggest food ordering and delivery company in mainland China. They built their Progressive Web App (PWA) as a multi-page app to improve its mobile web experience, making it faster and more reliable in flaky connections, while accommodating their operational needs to best serve their customers.
Bear 71 is an interactive documentary launched by the National Film Board of Canada in 2012 to much critical acclaim. When it was built, Flash was in its golden years but with the deprecation of browser support for Flash, we were eager to explore WebVR, both as a way to preserve the project's legacy and a chance to innovate how the story is experienced.
BookMyShow’s new Progressive Web App drives an 80% increase in conversions
BookMyShow is India’s largest ticketing firm, with 50+ million monthly visitors. They developed an improved version of their mobile website using a Progressive Web App (PWA), optimizing speed and removing data constraints, which resulted in an 80+% increase in conversions.
Housing.com increases conversions and lowers bounce rate by 40% with new PWA
Most Indian users reach the Internet via 2G and 3G networks, so a fast user experience is essential. To decrease load times, Housing.com added Service Workers and streamlined their site to help consumers quickly find what they’re looking for. Users can continue browsing properties and reviewing previous searches, all while offline.
With Smart Lock, AliExpress was able to improve the user experience in their app and websites: it’s faster for users to login and start the shopping journey, users do not need to constantly remember their passwords, and users can be automatically signed in when moving between platforms like Android and Chrome web.
Push notifications allowed us to bring one of the most compelling capabilities from our native app to our mobile site. We see a direct 20% click through rate from push notifications—having another channel to reach our users is a game changer.
Dance Tonite is an ever-changing VR collaboration with the band LCD Soundsystem and their fans. Built in WebVR, the project works across platforms–with and without VR–giving users a different role into the experience depending on their device. Project creators Jonathan Puckey, Moniker and Google’s Data Arts Team’s creative decisions and advanced optimization techniques enabled high-quality performance–close to 60FPS for 3DoF and 90FPS for 6DoF–and a compelling user experience across all platforms using a single codebase.
Infobae more than doubles time spent on mobile site with a Progressive Web App
Infobae took advantage of service worker to deliver reliable performance on unreliable networks. Their best-in-class PWA achieved a performance score of 93/100 on Lighthouse, an automated tool for measuring web-page quality.
Ola drives mobility for a billion Indians with Progressive Web App
Ola's new Progressive Web App is PWA is 300X smaller than downloading the Android app and 500X smaller than downloading their iOS app. Repeat visits use as little as 10KB. This low data consumption translates into a 3.4-second first visit and less than a second for repeat visits.
Twitter Lite PWA Significantly Increases Engagement and Reduces Data Usage
The Twitter Lite Progressive Web App combines the best of the modern web and native features to deliver a more robust experience, with explicit goals for instant loading, user engagement and lower data consumption
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.
The PlayCanvas WebVR Lab is a living project from the PlayCanvas team. It represents the team's research into developing scalable and responsive WebVR applications for all devices. It elegantly scales from a Google Cardboard or a Daydream View headset to a desktop VR device. The project is continually updated with new experiments that implement core interactions like teleportation, grabbing, manipulating objects, user interface and controllers.
Matterport VR lets you experience thousands of real-world places in interactive virtual reality. Using a combination of automated 3D interior mapping technology and robust vision processing algorithms, Matterport's 3D media system enables anyone to create immersive virtual environments from real places. Unlike 360˚ photos, Matterport Spaces allow users to interactively walk through any location.
With WebVR, anyone can explore Matterport's library of over 300,000 VR Spaces with a WebVR-enabled browser. Tour everything from celebrity homes to museums, canyons, iconic architecture, and beyond.
Within is a platform for storytelling in virtual reality and is available everywhere VR is. This includes the web. Leveraging WebVR, viewers are able to go to a website, click a link, and immediately watch Within’s films in immersive VR - including high end head-mounted displays. During the development process the team discovered rendering text is difficult in this new environment, and they created an example using shaders to make it a smoother process.
Land Lines is an experiment that lets you explore Google Earth satellite images through gesture. Using a combination of machine learning, optimized algorithms,and graphics card power, the experiment is able to run efficiently on your phone's web browser without a need for backend servers. This is a look into our development process and the various approaches we tried leading us to the final result.
Carnival Cruise Line, one of the world’s largest leisure-travel companies, wanted to enhance how it re-engaged its customers. Working with Mobify, Carnival implemented push notifications for mobile web users on Android and for desktop users on Chrome. The new strategy delivered a 42% engagement rate from customers who receive notifications.
AMP helps the Washington Post increase returning users from mobile search by 23%!
"We are committed to improving speed across the board. If our site takes a long time to load, it doesn’t matter how great our journalism is, some people will leave the page before they see what’s there" David Merrell, Senior Product Manager, The Washington Post
Learn how we built a the Google I/O 2016 Progressive Web App (IOWA) using web components, Polymer, and material design and launched it into production on Google.com.
IOWA is a single page application (SPA) that's built using web components, Polymer, Firebase, and has an extensive backend written in App Engine (Go). It pre-caches content for offline users using a service worker, dynamically loads new pages, gracefully transitions between views, and reuses content after first load.
"Smarter shopping, better living!" is the motto of AliExpress, a website where shoppers can buy everything from baby clothes to refrigerators directly from China. Part of the Alibaba Group, the global online retail marketplace is now a popular e-commerce site in America, Russia, and Brazil.
"Push Notifications are a huge part of our mobile engagement strategy. It’s a more personal way to communicate with our customers. That’s incredibly valuable to our bottom line." Mujeeb Hazzaa, Chief Business Development Officer
"We finally have proper means to address our fastest growing pool of customers — mobile web users. That’s incredibly valuable. We even see better results from web Push Notifications than from app pushes." Jeremy Doutte, Jumia CEO
"We estimate that with our new light, super-fast, UX-rich browsing capability, customers’ data consumption will fall dramatically which we believe will result in a corresponding increase in conversions." Shola Adekoya, Konga.com CEO.
"With a new user growth rate of 100%, quarter-on-quarter, the mobile web is at the heart of our success...It’s a major venue for low-cost and highly effective customer acquisition and engagement." Lucas Lu, 5miles CEO
NET-A-PORTER implemented a component-based design on their online properties using Google's Polymer library. The result was a large saving in development time, standarized code across their sites and an improved SEO performance through use of structured data.
Flipkart triples time-on-site with Progressive Web App
In 2015, Flipkart, India’s largest e-commerce site, adopted an app-only strategy and temporarily shut down their mobile website. The company found it harder and harder to provide a user experience that was as fast and engaging as that of their mobile app. But then, Flipkart decided to rethink their development approach. They were drawn back to the mobile web by the introduction of features that made the mobile web run instantly, work offline, and re-engage users.
How we used Polymer to create a high-performance WebGL mobile controlled Lightsaber that is modular and configurable. We review some of the key details of our project to help you save time when creating your own next time you run into a pack of angry Stormtroopers.