閒魚基於Flutter技術的架構演進和創新

Demo_Yang發表於2020-03-04

想學Flutter,就請關注這個專欄

Flutter系列(一)——詳細介紹

Flutter系列(二)——與React Native進行對比

Flutter系列(三)——環境搭建(Windows)

文件歸檔:

github.com/yang0range/…
程式碼歸檔:
github.com/yang0range/…
歡迎Start!歡迎Follow!
閒魚基於Flutter技術的架構演進和創新

閒魚——三億人都在用的閒置交易社群

最近一段時間一直學習Flutter,也嘗試寫一下Demo,但是在用的時候。從一開始驚豔到了,覺得寫起來很爽,各種UI效果實現起來很棒,而且由於渲染機制,還讓雙端甚至多端的UI保持一致以及幾乎可以和Native先媲美的使用者體驗。但是慢慢就又發現了許多新的坑,新的問題,確實也很不爽。

為此特意從網上找了一些大廠的資料借鑑一下。

閒魚是使用Flutter非常早的團隊,而且閒魚對於Flutter的應用,甚至二次開發都走在前面,在保持專案穩定的同時,又開源出很多有價值的東西。

為此特意找了一下閒魚客戶端負責人——於佳在全球前端大會上的一個分享,仔細看看確實收穫頗豐。

什麼樣的團隊更應該關注Flutter?

Flutter很早就推出了,而且我之前也通過一篇文章,詳細介紹了Flutter

一個新技術推出來是一刀切的把現在的內容全替換成Flutter嗎?或者說什麼樣的團隊更應該關注Flutter

如果團隊是這樣的團隊那麼就應該更多的關注一下Flutter

  • 中小型的團隊,更加註重產出比,人效比的團隊。
  • 特定的使用者比較多的,比如Android端較多,那麼可以採用Flutter開發然後同步IOS端。
  • App工廠類的,比如像頭條這種App工廠,對於更新迭代較快團隊。

如何將Flutter和現有App進行融合?

已有 App+Flutter 容器

閒魚基於Flutter技術的架構演進和創新
image.png

因為現有的APP可能是基於某種架構或者某些邏輯已經成型,倘若重新用Flutter去打造一個APP顯然是不顯示的,那麼如何儘可能快速的把Flutter融合到我們當前的專案的同時,又要保證兩者的無縫銜接以及高效能呢?

閒魚用兩種方式來解決以上問題。

1.了全域性共享同一個 FlutterViewController 的方式保證
了記憶體佔用的最小。

2.Dart 側提供一個 BoostContainerManager 的方式,提供了對多個
Navigator 的管理,來避免堆疊邏輯混亂的問題。

針對這一部分工作,閒魚已經開源了一個專案 Flutter Boots
專案地址

閒魚基於Flutter技術的架構演進和創新

詳細的介紹可以參閱GitHub上的文件GitHub地址

如何讓整個團隊快速上手Flutter

這裡是給我印象最深的一部分。

在自己專案的開發當中,經常也會遇到大家的書寫習慣導致形式各異的程式碼結構,甚至穩定性還不能保證。特別是多人協作的過程當中後期維護,還是工作交接的過程當中不是很便捷。

如何拉高程式碼的下限,寫出來的程式碼保持一個80%以上的質量度。

為了解決這個問題,閒魚選擇了Flutter Redux方案並加以優化經過三個版本迭代最終落地了Fish Redux

結構圖如下。

閒魚基於Flutter技術的架構演進和創新
image.png

詳細的內容介紹可以在GitHub文件當中看到。
開源地址:https://github.com/alibaba/fish-redux

最後

整個分享內容還是乾貨滿滿,我只是針對印象比較深的內容進行了整理。

最近剛開始慢慢接觸Flutter對於很多比較深的概念和構想理解還是遠遠不夠,希望在今後的實踐當中,慢慢用到甚至會體會到閒魚在Flutter的架構演變當中的思想。

Flutter已經是Top20的軟體庫,通過接下來的一系列的文章,希望我和大家一起來學習Flutter,一起進步,一起有所收穫,掌握未來技術主流的主動權!

閒魚推出了一個
Flutter in action——閒魚最佳實踐的文件,針對Flutter從開源工具,到企業級應用實踐再到混合開發實踐指南等內容都做了一個詳盡的介紹。

關注我的公眾號,並回復"閒魚"即可得到,相信會讓你受益匪淺!

歡迎關注公共號

關注公眾號會有更多收穫!

閒魚基於Flutter技術的架構演進和創新


相關文章