flutter是什么
最近同事分享了一篇flutter操作系統(tǒng)慕淡，感覺不錯，自己總結(jié)了一下树姨，發(fā)上來給大家一個參考冤今，F(xiàn)lutter 是 Google 開發(fā)的一套全新的跨平臺闺兢、開源 UI 框架，支持 iOS戏罢、Android 系統(tǒng)開發(fā)屋谭，它也是構(gòu)建未來的 Google Fuchsia 系統(tǒng)應(yīng)用的主要方式。在全世界龟糕，F(xiàn)lutter 正在 被越來越多的開發(fā)者和組織使用桐磁。
Fuchsia是什么
Fuchsia，是由Google公司開發(fā)的繼Android和Chrome OS之后的第三個系統(tǒng)翩蘸，已在Github中公開的部分源碼可以得知所意。Google對于Fuchsia的說明是“Pink（粉紅）+Purple（紫色）=Fuchsia（燈籠海棠，一個新的操作系統(tǒng)）
官方文檔地址 https://github.com/FuchsiaOS/FuchsiaOS-docs-zh_CN
Fuchsia 由 Google 公司開發(fā)的繼 Android 和 Chrome OS 之后的第三個系統(tǒng)催首，它不同于安卓使用的 Linux 內(nèi)核扶踊，而是采用的比較新的 Zircon 的內(nèi)核 。該系統(tǒng)與當下 Android 相比郎任，無論是存儲器還是內(nèi)存之類的硬件要求都大幅降低秧耗。Flutter 引擎+Dart 語言將可能會成為 Fuchsia 系統(tǒng)主要的 UI 開發(fā)框架。
順便所以下fuchsia
為什么要發(fā)布這個操作系統(tǒng)舶治？
- google認為linux不具有穩(wěn)定的驅(qū)動街口分井，F(xiàn)uchsia希望提供這樣一個穩(wěn)定的驅(qū)動接口，讓各個廠商根據(jù)這個接口自行開發(fā)和維護驅(qū)動霉猛，也是google對=掌控物聯(lián)網(wǎng)的一個決心尺锚。
- 雖然現(xiàn)在android的手機基本不會卡頓，但是現(xiàn)在的android手機對內(nèi)存要求還是不低惜浅，而
Magenta是微內(nèi)核瘫辩，無論是對存儲還是內(nèi)存之類的硬件要求都大幅降低， - 操作系統(tǒng)的擴展坛悉，該操作系統(tǒng)可擴展到智能手機和桌面計算機上
- 該操作系統(tǒng)是支持Dart和flutter框架開發(fā)的伐厌，F(xiàn)lutter 是 Google 用以幫助開發(fā)者在 Android 和 iOS 兩個平臺，同時開發(fā)高質(zhì)量原生應(yīng)用的全新移動 UI 框架裸影。dart被直接編譯成原生代碼運行在硬件上挣轨，所以比android要快一點
fuchsia的內(nèi)核
不同于android使用的linux內(nèi)核，而是使用一種全新的內(nèi)核Zircon轩猩，那么這個內(nèi)核與linux有什么區(qū)別呢卷扮？
linux的驅(qū)動其實都是文件荡澎，但Magenta不是，F(xiàn)uchsia沒有傳統(tǒng)的“根文件系統(tǒng)”的概念画饥，各種文件系統(tǒng)衔瓮、設(shè)備驅(qū)動、服務(wù)都作為一個進程抖甘，讀寫文件就變成了先跟文件系統(tǒng)進程建立一個通道，所有的操作都是異步
因為Zircon是微內(nèi)核
微內(nèi)核與單體內(nèi)核不同葫慎，微內(nèi)核只是將OS中最核心的功能加入內(nèi)核衔彻，包括IPC通信、地址空間分配和基本的調(diào)度偷办，這些東西處在內(nèi)核態(tài)運行艰额。
而其他功能如設(shè)備驅(qū)動、文件系統(tǒng)椒涯、存儲管理柄沮、網(wǎng)絡(luò)等作為一個個處于用戶態(tài)的進程而向外提供某種服務(wù)來實現(xiàn)，而且這些處于用戶態(tài)的進程可以針對某些特定的應(yīng)用和環(huán)境需求進行定制
Flutter 特點以及優(yōu)勢
提高開發(fā)效率
- 跨平臺 同一份代碼開發(fā) iOS 和 Android 節(jié)省資源
- 用更少的代碼做更多的事情 采用 dart 語言簡潔高效
- 輕松迭代
- 在應(yīng)用程序運行時更改代碼并重新加載(熱重載)
- 修復(fù)崩潰并繼續(xù)從應(yīng)用程序停止的地方進行調(diào)試
創(chuàng)建美觀废岂，高度定制的用戶體驗
- 受益于使用 Flutter 框架提供的豐富的 Material Design 和 Cupertino(iOS 風 格)的 widget
- 原生性能使用 skia2D 渲染引擎祖搓，既不使用 WebView，也不使用操作系統(tǒng) 的原生控件湖苞，保證在各平臺上 UI 的一致性拯欧，而且也可以避免對原生控件依賴 而帶來的限制及高昂的維護成本，實現(xiàn)定制财骨、美觀镐作、品牌驅(qū)動的設(shè)計
一切皆為控件
Widget 是 Flutter 應(yīng)用程序用戶界面的基本構(gòu)建塊。每個 Widget 都是用戶界面一部分的不可變聲明隆箩。 與其他將視圖该贾、控制器、布局和其他屬性分離的框架不同捌臊，F(xiàn)lutter 具有一致的統(tǒng)一對象模型:widget杨蛋。
核心原則
- Flutter 包括一個現(xiàn)代的響應(yīng)式框架(Framework 開源)、一個2D渲染引擎娃属、現(xiàn)成的 widget 和開發(fā)工具六荒。這些組件可以幫助您快速地設(shè)計、構(gòu)建矾端、測試和調(diào)試應(yīng)用程序掏击。
關(guān)于跨平臺框架
跨平臺工具包歷來采用以下兩種方法之一:
1.將 Web 視圖包裝在本機應(yīng)用程序中，并將應(yīng)用程序構(gòu)建為網(wǎng)頁秩铆。
2.包裝原生平臺控件并提供對它們的一些跨平臺抽象砚亭。
第一種相關(guān)的框架有:Ruby on Rails灯变， Cordova ，Instant App...
優(yōu)勢:一套 HTML5APP 即可同時適用 iOS捅膘、Android 平臺添祸，適配性和體驗較好。版本服務(wù)器更新快寻仗，技術(shù)難度較低刃泌，開發(fā)工作量小，開發(fā)成本低署尤。
劣勢:用戶體驗大幅落后于原生 APP耙替，操作的流暢度，程序的執(zhí)行效率曹体，與原生 APP都有較大差距; HTML5 APP 受網(wǎng)速的影響較大俗扇，在網(wǎng)絡(luò)情況較差的情況下，HTML5 APP 往往連打開都困難箕别。
第二種相關(guān)的框架有:RN铜幽， Weex 等。
RN 可以最大限度的接近原生框架串稀，能夠在 Javascript 和 React 的基礎(chǔ)上獲得完全一致的開發(fā)體驗;構(gòu)建原生 App除抛，僅需學習一次，編寫任何平臺;支持線上動態(tài)性厨诸，可有效避免頻繁更新版本镶殷。缺點:是采用 Javascript 開發(fā)，需學 React微酬，成本高;需要JavaScript 橋接器绘趋，實現(xiàn) JS 到 Native 轉(zhuǎn)化，性能耗損大;必須不同平臺寫兩套代碼颗管，依賴暴露的接口陷遮。
weex 具有完美兼顧性能與動態(tài)性，讓移動開發(fā)者通過簡捷的前端語法寫出 Native 級別的性能體驗垦江，并支持 iOS帽馋、Android、YunOS 及 web 等多端部署比吭。缺點:控件太少绽族，基本只能實現(xiàn)最基本的效果;上手難度大。
Flutter 采取不同的方法衩藤。Flutter 既不使用 WebView吧慢，也不使用操作系統(tǒng)的原生控件。Flutter 使用 Skia 作為其 2D 渲染引擎赏表。該框架建立在 Skia 圖形庫上检诗，提供實際呈現(xiàn)的部件匈仗，而不僅僅是原生控件的包裝。
對比RN:Flutter 采用 Dart 開發(fā),可直接編譯成 Native 代碼逢慌，簡單易學悠轩，又能夠像web 一樣靈活，同時提供流暢的性能攻泼。自帶 UI 組件和渲染器火架，僅依賴系統(tǒng)提供的 Canvas無橋接耗損)。
Flutter 附帶的部件庫以及開源部件使其成為一個功能豐富的平臺忙菠。簡單地說距潘，F(xiàn)lutter是最接近移動開發(fā)人員用于跨平臺開發(fā)的理想平臺，靈活性只搁、性能幾乎毫無妥協(xié)。
暫不支持線上動態(tài)性俭尖，目前 Android 支持氢惋，ios 不支持。
Flutter 框架
Flutter 框架是一個分層的結(jié)構(gòu)稽犁，每個層都建立在前一層之上焰望。
Flutter Framework:純 Dart 實現(xiàn) SDK
- 底下兩層:底層 UI 庫，提供動畫已亥、手勢及繪制能力
- Rendering層:構(gòu)建 UI 樹熊赖，當 UI 樹有變化時，會計算出有變化的部分虑椎，然后更新UI 樹震鹉，最終將 UI 樹繪制到屏幕上
- Widgets 層:基礎(chǔ)組件庫，提供了 Material 和 Cupertino 兩種視覺風格的組件庫
Flutter Engine:純 C++實現(xiàn)的 SDK
- Skia:渲染引擎 開源的二維圖形庫
- Dart:Dart 運行時
- Text:文字排版引擎
Android 平臺捆姜，F(xiàn)lutter 引擎的 C/C++代碼是由 NDK 編譯传趾，iOS 平臺，則是由 LLVM 編譯泥技，兩個平臺的 Dart 代碼都是 AOT 編譯為本地代碼浆兰，F(xiàn)lutter 應(yīng)用程序使用本機指令集運行。Flutter 正是是通過使用相同的渲染器珊豹、框架和一組 widget簸呈，來同時構(gòu)建 iOS 和 Android 應(yīng)用，而無需維護兩套獨立的代碼庫店茶。
Flutter 渲染機制
Flutter 布局渲染的整體流程
當需要更新UI的時候蜕便，F(xiàn)ramework通知Engine，Engine 會等到下個 Vsync 信號到達的時候忽妒，會通知Framework玩裙，然后Framework 會進行 animations, build兼贸，layout，compositing吃溅，paint溶诞，最后生成 layer 提交給 Engine。Engine 會把 layer 進行組合决侈，生成紋理螺垢，最后通過 Open Gl 接口提交數(shù)據(jù)給 GPU， GPU 經(jīng)過處理后在顯示器上面顯示赖歌。整個流程如下圖:
從流程圖可以看出來枉圃，只有當有 UI 更新的才需要重新渲染，當然程序啟動的是默認
虛擬 DOM 技術(shù)
- Widget 樹:就是我們的 UI 組件樹庐冯，但這個只是一種描述信息孽亲，渲染引擎是不認識的
- RenderObject 樹:這才是渲染引擎真的認識的，我們需要將 Widget 轉(zhuǎn)化為能用來渲染視圖的 Render Object
- 虛擬 DOM 解決了一個重要的矛盾:就是 DOM 操作的性能損耗與頻繁進行局部DOM 操作的矛盾
- 沒用虛擬 DOM 之前:DOM 會在每一次元素更新到來之時渲染一次 DOM
- 用了虛擬 DOM 之后:虛擬 DOM 會先匯總各個元素的更新情況展父，通過 diff 算法計算出與原來 DOM 樹的差異返劲，最后通過一次 DOM 更新解決。
Flutter 編譯機制
Flutter 之所以采用 Dart 語言栖茉，其中很重要的一點就是因為 Dart 同時支持 JIT 和 AOT兩種編譯方式
基于 JIT 的快速開發(fā)周期(熱重載):Flutter 在開發(fā)階段采用篮绿，采用 JIT 模式，這樣就避免了每次改動都要進行編譯吕漂，極大的節(jié)省了開發(fā)時間;
基于 AOT 的發(fā)布包: Flutter 在發(fā)布時可以通過 AOT 生成高效的 ARM 代碼以保證應(yīng)用性能亲配。而 JavaScript 則不具有這個能力。
JIT惶凝，Just-in-time,動態(tài)(即時)編譯吼虎，邊運行邊編譯;
AOT，Ahead Of Time梨睁，指運行前編譯;
Flutter 為什么選擇 Dart
Flutter 在四個主要維度進行了評估鲸睛，并考慮了框架作者、開發(fā)人員和最終用戶的需求等因素坡贺。發(fā)現(xiàn)不同的語言在不同的層面符合一部分需求官辈，但 Dart 在所有評估維度上得分都很高，并且符合我們的所有要求和標準遍坟。
Dart 運行時和編譯器支持 Flutter 的兩個關(guān)鍵特性的組合:基于 JIT 的快速開發(fā)周期:允許使用類型的語言進行形狀更改和有狀態(tài)的熱重載;以及 AOT 編譯器拳亿，可生成高效的 ARM 代碼，可以快速啟動并擁有可預(yù)測的生產(chǎn)部署性能愿伴。
此外肺魁，我們有機會與 Dart 社區(qū)密切合作，Dart 社區(qū)正在積極投入資源改進 Dart 在Flutter 中的使用隔节。例如鹅经，當我們采用 Dart 時寂呛，該語言沒有提供生成原生二進制文件的工具鏈(這對于實現(xiàn)可預(yù)測的高性能是很有幫助的)，但是現(xiàn)在實現(xiàn)了瘾晃，因為 Dart 團隊為Flutter 構(gòu)建了它贷痪。同樣，Dart VM 之前已經(jīng)針對吞吐量進行了優(yōu)化蹦误，但團隊現(xiàn)在正在優(yōu)化VM 的延遲時間劫拢，這對于 Flutter 的工作負載更為重要。
Dart 在以下主要標準上得到高分:
- 開發(fā)人員的效率强胰。Flutter 的主要價值主張之一是通過讓開發(fā)人員使用相同的代碼庫為iOS 和 Android 創(chuàng)建應(yīng)用程序舱沧，從而節(jié)省了工程資源。使用高效的語言可以進一步加速開發(fā)周期偶洋，并使 Flutter 更具吸引力熟吏。這對我們的 framework 團隊和開發(fā)人員都非常重要。大部分 Flutter 功能都是用 Dart 實現(xiàn)玄窝，因此我們需要在 10 萬行代碼時能保持高效的而不會犧牲 framework 和 widget 的可讀性分俯。
- 面向?qū)ο蟆ｋm然我們可以使用非面向?qū)ο蟮恼Z言哆料，但這意味著要重新解決幾個難題。另外吗铐，絕大多數(shù)開發(fā)人員都具有面向?qū)ο箝_發(fā)的經(jīng)驗东亦，因此更容易學習如何使用 Flutter進行開發(fā)。
- 可預(yù)測唬渗，高性能典阵。借助 Flutter，我們希望使開發(fā)人員能夠快速創(chuàng)建流暢的用戶體驗镊逝。為了實現(xiàn)這一點壮啊，我們需要能夠在每個動畫幀中運行大量的代碼。這意味著我們需要一種既能提供高性能又能提供可預(yù)測性能的語言撑蒜，而不會出現(xiàn)會導致丟幀的周期性暫停歹啼。
- 快速內(nèi)存分配。Flutter 框架使用函數(shù)式流座菠，它很大程度上依賴于底層的內(nèi)存分配器狸眼，從而有效地處理小的、短期的內(nèi)存分配會非常重要浴滴，所以在缺乏此功能的語言中 Flutter無法有效地工作拓萌。
參考網(wǎng)址:
https://flutterchina.club/ https://juejin.im/tag/Flutter https://juejin.im/post/5c4e6dc66fb9a049eb3c516a https://www.colabug.com/4164166.html http://www.reibang.com/p/5aa4f2a7ed0e http://www.reibang.com/p/d41952e51120 http://www.reibang.com/p/9e5f4c81cc7d
https://www.zhihu.com/question/50156415/answer/280947564?utm_source=wechat_session&utm_medium=social
