Flutter Web 如何降低您的應用開發成本

你想出了一個產品創意，但你需要一個將它推向世界的計劃。 為了向盡可能多的用戶公開您的服務，您需要移動和網絡應用程序。 但是你的簡短研究是殘酷的——雖然你只有一個狹隘的想法，但它需要三個不同的應用程序（Android、iOS、Web）、三種不同類型的專家（Kotlin、Swift、JavaScript），甚至可能需要三個獨立的供應商。

但你不是第一個擔任這個職位的人。 Airbnb、Uber Eats 和 Discord 等應用程序的創建者也站在您現在的位置。 他們都決定採用跨平台解決方案。 看起來 2020 年這個學科中最重要的參與者是 Flutter。

什麼是顫振？

Flutter 是一個谷歌框架，它允許你使用一個代碼庫為 iOS 和 Android 開發移動應用程序。 Flutter 的第一個穩定版本於 2018 年底發布。谷歌創建 Flutter 是為了應對移動應用程序預算的融化和 React Native 的日益普及，成為其主要競爭對手。

Flutter 引起了人們對 Dart 的關注，這是一種來自 Google 的面向對象的語言，據許多領域專家稱，它是所有移動、Web 和桌面開發的未來。 與 React Native 使用的 JavaScript 相比，Dart 是完全面向對象和強類型的。 這對您的業務意味著什麼？ Dart 中交付的代碼更能抵抗錯誤並且更容易維護，即使在不斷變化的團隊中工作多年。

Flutter for Web 征服瀏覽器

這一切如何轉化為網絡？ 2020 年對於 Flutter 來說是重要的一年，因為它帶來了新的挑戰。 該框架即將征服更大的屏幕和網絡瀏覽器。 在過去的兩年中，除了 Flutter 之外，還有一個名為Hummingbird的研究項目，該項目旨在從 iOS 和 Android 應用程序使用的相同 Flutter 代碼生成 Web 應用程序。

項目成熟，一年前核心團隊將其納入框架，目前（截至 2020 年 5 月）仍處於 beta 分支。 這是什麼意思？ 即使在今天，使用 Flutter 構建 Web 應用程序也是可能的，而且 Google 團隊可以隨時宣布它是穩定的。 一碼一技，一石三鳥。 看起來您的項目非常適合。

跨平台應用程序的場景非常普遍。 許多流行和知名的解決方案都使用此模型來節省時間和金錢。 沃爾瑪、Soundcloud 和 Bloomberg 已決定開發跨平台移動應用程序。 我敢打賭，您的手機上至少有一個跨平台應用程序。

對跨平台開發感到好奇？

學到更多

然而，在此過程中構建 Web 應用程序的可能性在幾個月前才向我們開放。 儘管目前還沒有大品牌決定採取這一舉措，但今天很明顯，它遲早會成為初創公司和快速 PoC 的絕佳工具。

Flutter 為您的應用帶來的好處

降低開發成本

使用 Flutter for Web，在一個技術連接的團隊中，使用一個代碼庫以一種速度創建三個應用程序。 您不必尋找三種不同技術的供應商，然後同步他們的工作。 無需重複相同的支付功能或社交媒體授權三次。

但是，這並不意味著您可以將支出數量限制為三倍。 為跨平台提供某種功能通常會更複雜一些。 以我的經驗，有一個類似於跨平台乘數的東西等於 1.2-1.5。 這意味著如果一個功能需要 X 小時開發一個平台，則需要 (1.2-1.5) * X 跨平台。 儘管如此，與 x3 相比，x1.5 可能是您預算的一個成功案例。

更快的應用程序開發

綜上所述，Flutter 成為 PoC 和產品創意驗證的絕佳選擇。 在短短幾週內，您就可以實現一個可以輕鬆發佈到應用商店的工作應用程序。 在取得潛在成功後，您可以考慮將應用程序重建為原生技術。 Airbnb 緊隨其後。 在其跨平台移動應用取得成功後，他們決定在 2018 年轉向原生應用。

更簡單的維護過程

另外，請記住當您的應用程序最終成功時會發生什麼。 當它進入維護時，由一名 Dart/Flutter 專家來維護應用程序要容易得多。 僅通過維護代碼，您的企業可能無法全職為三個不同的開發人員找到任務。 同樣，他們技能的任何不平衡都會導致工作節奏的變化。

考慮到不同平台上的共享外觀和感覺，開發團隊的技能也很重要。 在三個項目上工作，它們的最終形狀很大程度上取決於開發人員的技能和 UI 態度。 當 iOS 用戶更喜歡圓角而 Android 用戶不那麼喜歡圓角時，可能會發現這兩個應用程序在影響產品品牌的方式上會有所不同。

針對 Web 風險的 Flutter

開發技術問題

好的，但是選擇 Flutter for Web 是否有任何風險或缺點？ 與往常一樣，這個故事有兩個方面。 從技術的角度來看，我們必須記住它仍然是一個測試版技術。 所以它並不完全穩定，你甚至可能遇到無法解決的問題。 對共存的 Flutter 庫的支持有時也不完整。 庫在移動設備上像魅力一樣工作但在網絡應用程序上崩潰是很常見的，因為它沒有為此進行優化。 當僅限於 UI 時，這是一個小問題，但如果它是您的主要支付服務集成，則可能會很麻煩。

Web 應用程序異常

另一個問題是即使 Android 和 iOS 應用程序的世界非常相似，並且大多數情況下的代碼庫是 95-100% 相同，但這可能不適用於瀏覽器版本。 底部工作表抽屜、底部選項卡菜單或水平輪播是很好的移動 UX 模式，但不適用於 Web。 通常，您只需要為 Web 應用程序創建例外。 建築設計在移動和網絡中通常需要完全不同。 在工作之初，最好在設計師和開發人員之間建立一個圓桌討論。 讓他們分享他們的觀點並嘗試達成共識，特別是如果您關心您的預算和日期。

Flutter 與 React Native

但是 Flutter for Web 是您唯一的選擇嗎？ 當然不是。 它最重要的替代品是 React Native。 React Native 是 Facebook 在 Flutter 之前發明和支持的競爭性框架。 它允許你做完全相同的事情——構建所有的 iOS、Android 和 Web 應用程序（類似於 Flutter，時間相對較短）。

探索移動應用的未來

免費獲取報告！

在過去的兩年裡，我一直在使用 React Native，最近進入了 Flutter 世界，所以如果你在這兩者之間做出決定，我可以給你一些建議。 首先，這場決鬥沒有一個贏家，兩種技術都很成熟，而且都是優秀的跨平台。 但是在實施特定項目時，有一些細微差別可以帶來優勢：

• 如果你特別關心手勢相關的 UI （滑動、拖動、拉出抽屜等），那麼 Flutter 將是一個更好的選擇，因為它在原生端的架構和手勢支持。 RN 有時很難提供良好的手勢 + 動畫組合性能。
• 如果Web 是您業務的關鍵接觸點，請選擇 React Native。 RN 生成的瀏覽器應用程序更接近原生開發產品，您可以使用原生工具對其進行調試。 另一方面，Web 項目的 Flutter 不會轉譯為典型的 DOM，需要適配器。
• 如果您的應用程序要經過多年維護和開發（或者開發它的團隊可能會隨著時間而改變），那麼 Flutter 和 Dart 可能是更好的解決方案。
• 如果您的應用程序假設使用稍微複雜一些的機制（藍牙、生物識別、地理位置）或外部集成（支付、社交媒體），那麼 React Native 已經存在的時間更長，並且擁有更廣泛的庫。 Flutter for Web 生態系統每個月都在增長，但仍然應該在每個項目之前對可用庫進行研究。

想深入了解這兩個廣受歡迎的框架嗎？ 查看我們對 React Native 和 Flutter 的比較！

加起來

用戶從未如此分散在平台之間。 移動設備和網絡瀏覽器只是冰山一角。 用戶越來越多地使用汽車、手錶和電視機中的應用程序，而語音助手也變得越來越流行。 因此，需要簡化流程，降低軟件生產成本。 一個用於 Web 和移動開發的代碼庫已經是一種常見的模式，而 Flutter for Web 就是一個很棒的例子。

使用 Flutter 構建您的下一個應用程序

我們一起工作吧

很長一段時間，我認為 Flutter for Web 是一項新興技術。 我最近的工作讓我改變了主意，現在我得到了糾正。 Flutter 是一個站在光明未來面前的成年青年，絕對值得考慮。 對於預算少、期限短的想法來說，這似乎是一個有吸引力的選擇。 它適用於那些想要快速、低成本地驗證他們的想法的人，那些有想法並正在響應市場需求的人。 這與 Flutter 在軟件開發中所做的完全一樣。

聽起來很有希望？

想知道跨平台開發是否適合您的業務？ 聯繫我們的團隊並獲得對您的項目的估計。