Airbnb PWA：渐进式 Web 应用的完美示例

假设您正在寻找一种高度可靠的解决方案，以保持您的网站快速稳定运行，同时有效地运行以吸引用户停留更长时间并参与活动。 在这种情况下，PWA 可能正是您所需要的。 如此多的品牌采用了 PWA 并获得了世界知名且盈利的成功，其中包括Airbnb PWA 。 我们将分解 PWA 应用程序的真正胜利案例，而不是用名称和数字来探究表面。 让我们揭开帷幕，探索 Airbnb PWA 的故事。

Airbnb概述

世界上最有前途的初创公司最初的想法是 Air Bed and Breakfast，当地人允许游客留在他们的房子里，建立新的联系，同时分享一种低成本的替代方式来吃饭、休息和睡觉。

起初，欢迎陌生人进屋的提议似乎很离谱，但 Airbnb 已迅速成长为 21 世纪最成功的初创公司之一。

Airbnb 成立于 2008 年和十年后，已经拥有 1.5 亿用户、超过 700 万个房源、400 万房东，活跃于 200 多个国家和 81,000 个城市。 报告显示，超过 10 亿旅行者租用了 Airbnb 房屋，为房东创造了大约 650 亿美元的收入。

Airbnb 现在为全球旅行者提供最广泛的物业租赁服务，可以选择共享空间的单间，也可以为自己和多人选择整个空间。 它的商业模式类似于优步，一个聚合平台，允许有需求的人和供应商联系并开展业务。

Airbnb 为人们提供了一种社区感、独特的个人体验，以及一种释放压力、预算友好的住宿方式。

许多客人喜欢与 Airbnb 一起旅行，因为他们受到房东的欢迎进入社区，有机会更深入地探索文化并结交新的本地朋友。

导致 Airbnb PWA 集成的背景

这个故事可以追溯到几年前，大约在 2018 年底，当时移动浏览器获得了指数级的关注和投资。 然而，Airbnb 的版本仍然是来自桌面的比例响应版本。 该团队还承认，他们以最少的工程忽略了它。

移动网络是他们访问量最大的平台，尤其是在成长型市场，吸引了越来越多的 Airbnb 预订流量。 然而，它的表现低于世界上最大的旅游住宿搜索引擎的行业标准。

事实证明，当用户一年只需要 3 到 4 次时，他们发现安装 Airbnb 原生应用程序毫无用处。 由于他们依赖移动设备而不是任何其他设备，唯一的出路就是通过移动网络。

虽然平均花在应用上的时间远远超过在浏览器上的时间，但用户一天中的大部分时间却不均衡地分布在他们最喜欢的 5 个应用上，其中一个应用接近 50%。 用户根本看不到下载另一个他们不经常使用的应用程序并浪费他们的存储空间的意义。

市场对出色的移动浏览体验特别感兴趣，因为互联网连接问题困扰着他们的应用程序安装（200MB 大小）和消费。

以下是 Airbnb PWA 转型之前的一些近距离观察：

• 慢：移动浏览器上的用户在令人讨厌的空白页面上等待超过 10 秒，然后图像才开始显示。 4G 网络平均需要 13 秒才能加载整个页面。 不令人印象深刻。
• 设计不佳：一些组件执行得非常糟糕并且放错了位置，导致单词丢失和指令混乱。 地图对于游客了解从 Airbnb 到附近地点的距离至关重要，但它的互动速度很慢，几乎无法阅读这些文字。 并计算所有重叠的元素和照片上的文字，破坏了快照和旁注的含义。
• 难以使用：当许多交互点不响应手指而只响应鼠标时，移动浏览器似乎从他们的脑海中消失了。 一切都没有意义。 对于一个可怜的流浪者来说，这就像一个令人困惑的偏离路线。 但导航赔率的至高无上是当他们单击按钮安装本机应用程序时。 他们被要求填写他们的电话号码，以便他们可以收到带有应用商店链接的文本。

如果移动浏览器不是Airbnb用户的第一印象，情况也不会那么糟糕。 不幸的是，数据表明 65% 的新用户来自移动网络。 因此，他们不得不扭转这种局面。

切换到 PWA 如何解决 Airbnb 的请求？

为了描述移动浏览领域的激烈程度，以下是行业统计数据：

• 如果必须等待超过 3 秒，53% 的访问者会反弹。
• 57% 的响应者表示没有吸引力的移动网站不会得到他们的建议。
• 85% 的响应者预计移动网络将是桌面的更新版本，而不是相反。

用户希望移动版本快速、方便、设计精美，并且与移动原生应用程序一样引人入胜。 在 PWA 的帮助下，Airbnb 可以创建一个运行速度极快、安全稳定的移动网络，同时执行一些原生应用程序的最佳功能。

Airbnb PWA 允许用户将 12MB 的版本添加到他们的主屏幕，而不是过度消耗 200MB 的应用程序。 客人和主人可以从他们的通知面板接收弹出消息。

不仅如此，为了帮助世界各地的 Airbnb 用户即使在连接较弱的情况下也能轻松选择住宿地点，PWA 将即时加载和离线模式带入了业务。

Airbnb PWA 解决方案

理念

Airbnb 的目标只有一个：为世界一流的寄宿家庭和其他度假租赁公司打造世界一流的移动浏览体验。 在赶上在线革命之后，他们意识到保持移动友好不再是一种优势，而是一种必需品。

他们的策略是转向移动优先，即移动网络优先。 Airbnb 的许多新访问者来自移动网络，他们期待与原生应用程序之旅类似的东西。 他们将给用户他们想要的东西。

执行

原生应用程序以其方便的滑动菜单和底部导航而闻名。 Airbnb 决定沿用经典，升级汉堡菜单和用于帐户注册的日志标签栏。 接下来，地图是重新设计的重要组成部分，因为它是列表选择的最重要项目。

他们还确保 PWA 可以在任何屏幕尺寸和设备上发挥最佳性能。 一点额外的努力会让一切变得不同。

最后，旧的混乱、难以使用的用户流完全注册了重新指定列表，所有内容堵塞和布局错误都将被收集和修复。

结果

PWA 为 Airbnb 提供了针对迷你版进行优化的选项，将加载时间从 11.9 秒降至 4.69 秒。 当它变得更快时，它会变得更流畅、更灵敏、更方便，所有这些都会导致更高的用户参与度，他们正确滑动的次数达到了历史最高水平。

甚至在他们有机会完成 PWA 项目之前，就已经收集了相当多的成果和成就：

• 尽管困难重重，Airbnb 团队还是在不到一年的时间里成功完成了移动网页的重新设计和重新开发。
• 转化率上升了 25%。
• 平均加载时间约为 5.5 秒，性能提升 2.5 倍。

如何构建像 Airbnb 一样的 PWA？

Airbnb PWA 在实践中是世界级水平的移动网络平台。 让我们在那里澄清标准。 Airbnb PWA 是数十亿寄宿家庭和度假租赁的上市地点，类似于一个拥有大量产品组合的电子商务网站。

使用庞大的数据库，加载过程可能需要更长的时间来处理代码和响应请求。 因此，在线商店需要更小规模的优化版本才能快速启动并保持快速。

这就是 PWA 在电子商务行业中享有盛誉的原因。 如果您是一位在线企业主，想要改造您的缓慢且表现不佳的商店，那么这是给您的。

为什么选择 Tigren PWA？

我们知道您可以轻松地接触到大量的电子商务开发服务，但是搜索和检查每个最适合您需要的机构会浪费大量时间。

Tigren 是世界顶级的 PWA 开发外包机构之一。 自 PWA 技术问世以来，我们一直在摸索着掌握 PWA 技术。 时至今日，我们已与全球近 1000 家客户合作，并帮助他们利用投资回报率。

高级 Tigren PWA 解决方案

我们可以帮助您：

• 从头开始构建 PWA 网站
• 自定义构建和集成 PWA 的各个部分
• 优化和升级现有 PWA
• 高级即用型 TigrenPWA 主题

联系我们时，您将获得免费咨询，您甚至可以在决定我们是否合适之前询问报价。 根据项目的复杂性，我们可能会提供 3-12 个月的免费支持，从黄昏到黎明与您同在，以确保结果正是您想要的。

关键要点

Airbnb PWA 取得了巨大的成功，让背后的负责人回首往事时感到自豪，而当用户开始准备下一次旅行时，他们都会微笑。

Airbnb 快速、可靠、稳定、设计迷人、引人入胜，再加上他们的团队已经提供了一段时间的世界级服务； 他们还能要求什么？

鉴于 PWA 有望成为主导在线领域的未来下一个标准，您对早期采用者的邀请有何看法？