Home Top Stories Building a cathedral – the vision powering Flipkart’s Progressive Web App
Building a cathedral – the vision powering Flipkart’s Progressive Web App
0

Building a cathedral – the vision powering Flipkart’s Progressive Web App

Peeyush Ranjan, former CTO at Flipkart, shares perspectives on tech innovation, creating Flipkart Lite, and a sneak-peek into what the future holds

0

A few days ago I completed my first six months at Flipkart. In a short time, much has happened: Among other things, our engineering teams built and moved to a new datacenter (the biggest in India), successfully ran the biggest online sale India has ever seen, and launched a first-of-its-kind progressive web app, which merges the user experience of a downloadable smartphone app with the benefits of the open web.

This is all very exciting for us. But we think our new progressive web app Flipkart Lite is also exciting for mobile web players globally because the technology has powerful implications for the mobile app ecosystem and how engineers can think about building things.

In August,  I challenged the audience at the Mobilesparks conference in Bangalore to consider approaches to software development not simply to implement a new feature or build an app, but with the much bigger picture in mind. I was borrowing from Peter Drucker’s well-known ‘building a cathedral’ concept, which posits that the stone-cutter who views his occupation as the challenge of building a cathedral, rather than simply seeing it as a way to earn a living or being the best polisher of stones, is the one who adds the most value to the enterprise. In my experience, most engineers focus on fixing the obvious, pressing problem really well and fast. But the best ones think deeply from first principles about the what and why of the problem.

Our new web app is an example of engineers thinking about the big picture problem – about building a cathedral.

Peter Drucker’s well-known 'building a cathedral' concept posits that the stone-cutter who views his occupation as the challenge of building a cathedral, rather than simply seeing it as a way to earn a living or being the best polisher of stones, adds the most value to the enterprise. In my experience, most engineers focus on fixing the obvious, pressing problem really well and fast. But the best ones think deeply from first principles about the what and why of the problem.

The situation

Earlier this year, our company turned off its mobile website and redirected visitors to download the native applications on iOS and Android smartphones. The world construed this decision as an aggressive move to go ‘app-only’. But we saw it as the next step in providing the best experience to mobile users, whose numbers in India far exceed desktop users. At the time, three-quarters of our transactions were occurring through mobile devices, and native apps provided a much better experience than websites. Keep in mind it wasn’t just Flipkart that did this. A lot of mobile sites redirect visitors to install the app instead. Try going to www.yelp.com on your phone browser!

Because it takes so much energy just to bring a user to your doorstep, redirecting them to the App Store or Play Store requires some really good reasons. And there are really good reasons. Native apps have far superior user engagement metrics than mobile websites. Interactions are smoother, rendering quality is better, they have access to mobile resources, they can work offline at times, they can provide push notifications, and there is home screen presence to allow easy launching.

Even so, most websites lose 96% of their users in this transition to app stores. At Flipkart we did far better, but it wasn’t a result worth being proud of. We concluded that our conversion numbers were unacceptable.

The cathedral

Many years ago I oversaw YouTube’s effort to build clients for 20+ devices, some of which could run our HTML5-based site. At the time, one of the thoughts in my head was “Didn’t the web already win over the apps in the late 1990s? Why do we have to deal with device fragmentation and app-based siloing once again? Why do we have to deal with so many clients, so many versions out in the wild and such hassles as updating the app after shipping the client? Why can’t they just use HTML5?” And so on.

As Flipkart’s users began choosing the mobile app over website, the feeling was déjà vu: apps versus the web. Why couldn’t the website do everything the app could?

We at Flipkart discussed this problem. We asked ourselves: “Why can’t mobile websites provide the same great experience as smartphone native applications do?”

We did not ask ourselves “Should we turn the mobile website back on?” We did not ask “How can our mobile site be high performing and engaging?” Both are valid questions, but the bigger picture question was this: “Why did we, and a whole lot of other websites, have to make a choice between a mobile website and native application?”

Thinking of the problem this way led the team to create a list of things that would eliminate the differences between how we serve our app users versus our mobile web users. The added bonus was if we could solve for the differences, it would confer to mobile web users the other benefits that websites offer: Virtually zero download (4kb to get started, versus 10MB for a native app Play Store download) and immediate updates (meaning all one needs to do to make sure they are using the most updated version is to launch the app again). So we decided to seriously explore whether it was possible to do this – to bring together the best of both app and web.

The vision

The web does a great job of delivering high-quality software uniformly to every user. All that is required is that the user have a device that is  powerful enough to run the latest browser, and any apps are moved to the cloud. This generation of web apps saw amazing growth in use of computing for end users and a rapid demise of the shrink-wrapped app market share. With our new Flipkart Lite web app — and other Progressive Web Apps (PWAs) — we have a chance of effecting the same revolution in mobile world that the internet and browsers brought to the desktop world. With PWAs, you no longer need to go to a central place to download apps, which sit on your phone whether you use them or not, and require regular maintenance. Instead, all of that hassle moves to the cloud. With PWAs, we are breaking down the silos in the mobile world that the open internet broke in the desktop world.

When we shared our vision with Darin Fisher and Rahul Roy-Chowdhury of Google Chrome, they agreed to help us by implementing all the changes we needed from the browser. They had our wish list, and we had their early builds. Opera was also interested in supporting the same functionality, so they began implementing those changes as well. After a few months of tight loop development with both, Flipkart Lite was born.

The result: A web app that behaves like native

Flipkart Lite brings with it the engagement of native apps, a feature that websites don’t offer. That’s because it provides the user with a home screen icon that launches URL-less full-screen app. It give the user a super-fast experience (60fps rendering accelerated by GPU). And with the user’s permission, it can send notifications, access a phone’s hardware, address book, etc. – just like an app. It also has offline functionality to allow the user to see his past product views, instead of showing a white dinosaur. It works fast and is interactive irrespective of network flakiness. And this is just version 1.

What’s more, our new web app still has the best of the web in it. The user does  not need to download a lot of MBs or store it on the phone before he starts using it. The user never need worry about updates, because they will be automatically available every time you run the app.

A lot more technical detail about what we did is available here. To check it out, point your Android Chrome (v42+) or Opera (v33+) browser to www.flipkart.com.

We believe this is the first step in directly answering the question we started with: “Why can’t mobile websites have the same great experience smartphone native applications do?”

Now they can.

What next?

Flipkart Lite v1 is just the first step in the world of progressive web apps (PWAs). We believe that with the right level of underlying browser support, there will be complete functional convergence between web applications and native smartphone applications in the near future. Browsers do not have to be the app that renders what websites compute. They are changing to becoming the layer that provides native access to code that websites serve. We at Flipkart are proud to be pioneering that change.


Peeyush Ranjan, former Chief Technology Officer at Flipkart, was responsible for strengthening and building Flipkart’s technology backend. An ex-Google employee, Peeyush spent nine years at Mountain View, California, where he managed various engineering groups in Android, Motorola, Apps and Search. He holds degrees in Computer Science from IIT-Kharagpur and Purdue University and an MBA from the University of Washington.


Click here to read the original post.

Also read: Introducing Flipkart Lite

Enjoy shopping on Flipkart