Airbnb PWA: A Perfect Example Of Progressive Web App

Airbnb PWA_ A Perfect Example of Progressive Web App

Lots of brands have used PWAs to their advantage, earning big success and recognition around the globe. A standout star in this realm? That’s right, it’s Airbnb’s PWA.

But we’re not just going to name-drop and throw big numbers at you. Nope, we’re about to dive into a real-world success story of a PWA in action. So, get comfortable as we pull back the curtain on Airbnb’s PWA. Brace yourself for a tale so fascinating, you might just end up booking a cozy cabin in the woods!

An Overview Of Airbnb

The initial idea of the world’s most promising startup was Air Bed and Breakfast, where locals allow tourists to stay at their houses, making new connections while sharing a low-cost alternative way to eat, rest, and sleep.

The proposal seems outrageous at first to welcome strangers into the houses, but Airbnb has quickly grown into one of the most successful startups of the 21st century. 

Launched in 2008 and ten years later, Airbnb already has 150 million users, over seven million listings on display, run by 4 million hosts, and is active in over 200 countries and 81,000 cities. Reports show that over a billion travelers have rented an Airbnb home, creating roughly $65 billion for the hosts. 

airbnb pwa

Airbnb now serves as the most extensive property-renting service for travelers worldwide, choosing either from single rooms in a shared place or an entire place for themselves and multiple people. Its business model is similar to Uber, an aggregator platform allowing people in demand and providers to connect and do business. 

Airbnb gives people a sense of community, unique personal experiences, and a stress-released, budget-friendly way to travel accommodations. 

Many guests love traveling with Airbnb as they are welcomed into the communities by the hosts, get a chance to explore the culture deeper, and make new native friends. 

The Background That Led To Airbnb PWA Integration

The story dates back to a few years ago, around late 2018, when mobile browsers were gaining exponential attention and investment. Yet, Airbnb’s one was still a proportionally responsive version from the desktop. The team also admitted that they had ignored it with minimal engineering.

The mobile web was their most visited platform, especially in the growth markets, attracting a growing traffic rate to Airbnb booking. Yet, it performed below the industry standard for the world’s biggest search engine for travel accommodations. 

It turned out that users find it no use to install the Airbnb native app when they only need it 3 or 4 times a year. And as they rely on mobile rather than any other devices, the only way to go is through the mobile web. 

Although the average time spent on apps far exceeds the time on the browser, most of the users’ time in a day is unevenly distributed to 5 of their favorite apps, with a close of 50% on one app. Users simply don’t see the point of downloading another app they don’t frequently use and wasting their storage.

The markets are particularly interested in an excellent mobile browsing experience, as the issue with Internet connection troubles them with the app installation (200MB in size) and consumption. 

Here are some closer looks before Airbnb PWA transformation:

  • Slow: users on mobile browsers waited on an irritating blank page for over 10s before images started to show up. A 4G network took an average of 13s for a whole page to load. Not impressive. 
  • Poorly designed: some components were awfully implemented and misplaced, leading to missing words and confusing instructions. The map is essential for a tourist to understand the distance from Airbnb to nearby locations, yet it was slowly interactive and almost impossible to read the words. And counting all the overlapping elements and the running over text on photos, derailing the meaning of the snapshots and the side notes.
  • Hard to use: mobile browsers seemed to slip off their mind back then when many interaction points didn’t respond to fingers but mouses only. Everything didn’t make sense. It was just like a confusing de-route for a poor wanderer. But the supremacy of the navigation odds was when they clicked the button to install the native apps. They were asked to fill in their phone number so that they could receive a text with a link to the app store.

It wouldn’t be that worse if the mobile browser weren’t the first impression of users of Airbnb. Unfortunately, data indicated that 65% of their newcomers were from the mobile web. Therefore, they had to turn this situation upside down. 

How Is Switching To PWA Can Solve Airbnb’s Request?

To describe how fiercely the mobile browsing landscape is, here are the industry stats:

  • 53% of visitors bounce if they have to wait over 3s.
  • 57% of the responders said an unattractive mobile site wouldn’t get their recommendations.
  • 85% of the responders expected the mobile web would be the desktop’s updated version and not the other way around.

Users want the mobile version to be fast, convenient, beautifully designed, and as engaging as mobile native apps. With the help of PWA, Airbnb could create a mobile web that runs lightning-fast and is secure and stable while performing some of the native app’s best features. 

Airbnb PWA allows users to add the 12MB version to their home screen instead of an over-consuming 200MB app. Guests and hosts can receive popup messages from their notification panel.

Not only that, but to help Airbnb users from all over the world easily choose a place to stay even when their connection is weak, PWA brings the instant loading and offline mode into business.

The Airbnb PWA Resolution

airbnb pwa resolution

The Idea

Airbnb’s eyes were set on one straight goal: to create a world-class mobile browsing experience fitted to the world-best homestay and other vacation rentals company. After catching up with the online revolution, they realized staying mobile-friendly was no longer an advantage but a necessity. 

Their strategy was switching to mobile-first, which is to be mobile web first. Many of Airbnb’s new visitors came from the mobile web, and they would expect something that resembles the native app journey. And they were going to give the users what they wanted.  

The Execution

Native apps were famous for their handy slide menu and bottom navigation. Airbnb decided to go along with the classic, with the hamburger menu upgrade and a logging tab bar for account registration. Next, the map was a big part of the redesign as it’s the most important item for listing selection. 

They also ensured that the PWA could perform its best on any screen size and device. A little extra effort makes all the difference.

Finally, the old confusing, hard-to-use user flows were completely signed up for the redesignation list, where all the content jams and layout errors would be collected and fixed. 

The Results

PWA gave Airbnb the option to go optimized for the mini-version, with the minimized loading times from 11.9s down to 4.69s. When it gets faster, it gets smoother, more responsive, and more convenient, all leading to higher user involvement, and their number of swiping right moments reached its all-time high. 

And before they even got a chance to finish the PWA project, considerable results and achievements were collected:

  • Despite difficulties and odds, the Airbnb team managed to nail the mobile web redesign and redevelopment in less than a year.
  • The conversion rate had witnessed a rise of 25%. 
  • And a 2.5x improvement in performance with an approximate 5.5s of loading time on average.

How Can You Build A PWA Like Airbnb?

Airbnb PWA is the world-class level of a mobile web platform in practice. Let’s clear up the standard there. Airbnb PWA is where the listing of billions of homestay and vacation rentals takes place, similar to an ecommerce website with a long-haul product portfolio. 

With an immense database, the loading process can take an extended time to handle the code and respond to the request. Thus, an optimized version on a smaller scale is much needed for an online store to start and stay fast. 

That’s why PWA is famous among the ecommerce business. This is for you if you’re an online business owner who wants to transform your slow and poorly performed store. 

Why TigrenPWA?

We know that you can easily reach out to tons of ecommerce development services out there, but it would waste a lot of time to search and check every agency out there that is the most suitable one you need. 

Tigren is one of the world’s top agencies in PWA development. We had groped our way to master the PWA technology since its first came out. To this day, we have worked with nearly 1,000 clients worldwide and helped them leverage their ROI.  

We can help you with:

You will receive a free consultation when contacting us, and you can even ask for a quote before deciding if we’re a good match. Depending on the complexity of the projects, we may offer 3-12 months of free support, being with you from dusk to dawn to ensure the result is exactly what you came for.

Key Takeaways

Airbnb PWA was a big success, making the people in charge behind proud when looking back, and the users smiled whenever they started preparing for their next travel. 

Airbnb is fast, reliable, stable, captivatingly designed, and attractively engaging, plus the world-class their team has been offering for a while; what else can they ask for?

With the promising anticipation of PWA as the future-next standard dominating the online landscape, what is your verdict on the invitation for early adopters?

Read more: Current Progressive Web App Limitations To iOS Users

Leave a Reply

Your email address will not be published. Required fields are marked *