漸進式 Web 應用程序 (PWA)：前 3 名案例研究

已發表: 2019-06-19

想像一下，您剛剛啟動了您的初創公司，並且您的網站看起來很棒，但是您沒有足夠的預算來開發移動應用程序，這可能對您的業務戰略很重要。但是，它非常昂貴且有點風險。您還必須花費大量時間來構建本機應用程序，但沒有人非常了解您的品牌。人們會足夠信任您的應用程序以從 App Store 或 Google Play Store 下載它嗎？

更重要的是——您的客戶/讀者是否有足夠的決心採取一些額外的步驟，例如關閉您的網站、打開 Google Play 或 App Store，然後耐心等待應用安裝？

請記住，如今人們的要求要高得多。換句話說，他們也很不耐煩——他們期待快速的解決方案。從外部商店下載這樣的應用程序聽起來不是一個非常快速的操作，並且每個用戶都無法訪問原生應用程序。從用戶體驗的角度來看，客戶在實現他的（和你的）目標之前會遇到很多障礙。

還有一件事——你確定你的客戶有足夠的內部存儲空間來下載你的應用程序嗎？

因此，您將投入大量資金來構建移動應用程序（適用於 IOS 和 Android），但您無法確定人們是否會真正使用它。啊……不要忘記您需要花費在廣告和促銷上的所有這些巨額營銷預算！

但是等等，不要驚慌，幸運的是，你生活在 2019 年，當在創建移動應用程序時，漸進式 Web 應用程序正在成為一種常見的解決方案！

您聽說過漸進式 Web 應用程序嗎？如果沒有，現在是您趕上這一最新技術趨勢的機會，否則您將被甩在後面！我們已經寫了一篇全面的文章來解釋它們是什麼以及為什麼值得選擇這個選項。

今天，我們想給大家一些啟發，並介紹已經構建Progressive Web Apps 的品牌的成功案例。

TRIVAGO

Trivago 在提供 33 種不同語言的酒店搜索引擎方面享有盛譽。 Trivago 根據酒店信息、圖片、評級、評論、過濾器和其他功能，幫助用戶找到最優惠的價格。

問題

問題是 Trivago 注意到近年來移動用戶的顯著增加。該品牌意識到移動體驗對他們的客戶來說越來越重要。

然而，創建移動解決方案並不是小菜一碟，這意味著要做出艱難的選擇。具體來說，該公司不確定人們是否會接受下載移動應用程序的成本，只是為了檢查它是否符合他們的期望。他們還注意到許多人在移動連接質量方面存在問題。由於這些原因，Trivago 正在尋找與原生應用不同的機會。

 推薦閱讀：Progressive Web Apps vs Native Apps：哪個更適合你？

解決方案

最後，他們發現了漸進式 Web 應用程序，其功能似乎非常適合他們的需求。當時，他們正在尋找一種能夠為他們提供推送通知、離線模式和主屏幕快捷方式的解決方案。對於 Trivago 而言，最重要的因素是可以通過標準的移動瀏覽器訪問此應用程序。

這個 PWA 解決方案幫助他們構建應用程序，而無需涉及大型軟件開發團隊。他們一開始就專注於最重要的功能，例如推送通知、離線訪問以及將應用程序添加到主屏幕的可能性。當然，起初也有困難。他們說最大的挑戰之一是創建直觀的用戶界面，因為設計移動外觀與標準網站的外觀大不相同。根據 PWA 設計師 Laura Oades 的說法：

“在移動設備上，你還有一個額外的問題，那就是製作一個與平台無關且不會令人困惑的 UI”，“PWA 在設計上很大程度上是一個未知領域，對於創造性的問題解決者來說，這是一個真正的機會，可以擴展自己來定義一個新的標準。”

結果

Trivago 移動網站以 33 種語言提供，覆蓋 55 個國家/地區。
超過50 萬人在他們的主屏幕上添加了 Trivago 快捷方式，他們的參與度增加了150% 。
與之前的移動網站相比，Progressive Web App 吸引了更多的用戶。在 PWA 之前，僅記錄了 0.8% 的重複訪問，現在這個數字增加到平均 2%。
事實證明，推送通知是一種完美的溝通方式——它們有助於提高轉化率——PWA 中酒店優惠的點擊次數增加了 97%。

 推薦閱讀：旅遊行業的 7 個最佳漸進式 Web 應用

興趣

Pinterest是一個社交網絡，允許用戶通過將圖像或視頻發布（稱為Pinterest上的“固定”）到他們自己或他人的板（即“圖釘”的集合，通常具有共同的主題）並瀏覽其他用戶固定的內容

問題

在分析了未經身份驗證的移動網絡用戶的使用情況後，他們意識到他們舊的、緩慢的網絡體驗只能將 1% 的用戶轉化為註冊、登錄或本地應用程序安裝。提高這種對話率的機會是巨大的，這導致他們對 PWA 進行了投資。

Pinterest PWA 之所以開始，是因為他們專注於國際增長，這導致他們進入了移動網絡。

解決方案

超過3 個月的時間，Pinterest 使用 React、Redux 和 webpack 重建了他們的移動 Web 體驗。他們的移動網絡重寫導致核心業務指標的一些積極改進。

結果

他們的移動網絡重寫帶來了性能上的多項改進。

與舊的移動網絡體驗相比，花費的時間增加了40% ，用戶產生的廣告收入增加了44% ，核心參與度增加了60% ：

Pinterest 舊的移動 Web 體驗是一個整體——它包含大量 CPU 密集型 JavaScript，這些 JavaScript 推動了 Pin 頁面的加載和交互速度。

他們新的移動網絡體驗是一個巨大的改進。

他們不僅分解並削減了數百 KB 的 JavaScript，將核心包的大小從 650KB 減少到 150KB，而且還改進了關鍵性能指標。第一次有意義的繪畫從 4.2 秒減少到 1.8 秒，交互時間從 23 秒減少到 5.6 秒。

儘管 Pinterest 銷售 iOS 和 Android 應用程序，但它們能夠提供與這些應用程序在 Web 上相同的核心家庭提要體驗，而前期下載成本只是其中的一小部分——壓縮和 gzip 後只需約 150KB。這與為 Android 提供此體驗所需的 9.6MB 和為 iOS 提供此體驗所需的 56MB 形成鮮明對比

推特

如您所知，Twitter 是一個社交媒體平台，人們在其中發布稱為推文的短消息。它創建於 2006 年 3 月。現在它擁有超過 3.35 億活躍用戶（2018 年 7 月）。

問題

Twitter 注意到用戶在使用他們的移動網站時必須克服許多障礙。

他們中的一些人使用緩慢的移動網絡，並且移動設備存儲空間很小。因此，訪問者不願意花時間在 Twitter 的網站上或參與更多的發布和評論。 Twitter 希望為不使用本地應用程序或沒有足夠空間下載此應用程序的人找到一個有吸引力的替代方案。

解決方案

Twitter 決定構建一個漸進式 Web 應用程序，因為它似乎是現代網站和原生功能的最佳組合。即時加載、更低的數據消耗和大的可訪問性是 Twitter 一直在尋找的功能。

結果

結果令人印象深刻——數字不言自明：

跳出率下降 20%，
每個會話的頁面增加 65%，
發送的推文增加了 75%。

與之前的成功案例一樣，“添加到主屏幕”提示和推送通知顯著提高了用戶的參與度。正如本案例研究中所述，Twitter 注意到每天有250 000 名獨特的用戶平均每天從主屏幕運行 Twitter Lite 4 次。更重要的是，他們每天發送超過 1000 萬條推送通知。

根據 Twitter 的意圖，PWA 佔用的空間（僅 600 KB）比原生 Android 應用程序（23.5 MB）要少得多，因此人們更有可能在內部存儲中有足夠的空間來保存它。

更重要的是，Twitter 增加了數據保護模式，幫助用戶控制使用的移動數據量。借助此選項，您可以選擇要完全加載哪些圖像或視頻，哪些可以保留為預覽。

 推薦閱讀：PWA SEO：漸進式 Web 應用程序 (PWA) 是否有益於 SEO？ （帶有統計和示例）

擁抱網站的未來

PWA 是移動應用程序的未來。隨著時間的推移，它們有可能取代原生應用，成為原生應用和網站的完美結合。在採用新技術的速度是競爭優勢的世界中，能夠儘早採用 PWA 的企業可以顯著增加收入，提高用戶參與度，同時保持競爭優勢。

過去，Apple 對漸進式 Web 應用程序有一些限制，但是，它們現在越來越支持 PWA。對於為 Magento 電子商務網站尋找全方位完美 PWA 的在線商家，我們在 SimiCart 為您和您的商店提供完整的套餐。