細心的開發(fā)者會發(fā)現(xiàn)flutter構建的App體積比native的大一些，是什么原因造成App體積大呢？
創(chuàng)新互聯(lián)建站為客戶提供專業(yè)的成都網站建設、做網站、程序、域名、空間一條龍服務，提供基于WEB的系統(tǒng)開發(fā). 服務項目涵蓋了網頁設計、網站程序開發(fā)、WEB系統(tǒng)開發(fā)、微信二次開發(fā)、移動網站建設等網站方面業(yè)務。
其實flutter 在release時App體積和native的大小差不多，而debug時體積通常會大。debug版本體積較大是為了Hot reload和快速編譯。如果有flutter開發(fā)經驗的朋友都體驗過，如果您修改一下App的背景顏色，只需save一下就可以立刻看到修改后效果。我稱之為“像藝術家一樣在創(chuàng)造App”，因此為了實現(xiàn)這些目標，提高開發(fā)的效率，debug將占用全部資源。而當我們構建release版時，flutter又會采用AOT策略，提高App運行效率，release版只打包必需的資源，因而體積又會減少。
另外，flutter團隊也一直在尋找減小程序大小的方法。
Uniapp目前比較成熟，而且用的是Vue語法，學習成本比較低，而且行業(yè)里面用的也比較廣泛，而Flutter的話，學習成本略高，因為要學習新的語言，還有就是目前生態(tài)不是特別完備，等他再發(fā)展發(fā)展吧。黑馬程序員官網有成套免費視頻哦，有什么不懂的可以直接過去學習。您的采納是對我成長的鞭策
1. 建立一個flutter項目的命令
2. 在ios文件夾下，生成pods文件夾
3. Xcode環(huán)境簽名設置；
把錯誤的版本刪除再添加，可解決簽名錯誤問題；必須先刪除再添加，直接修改可能不起作用。團隊開發(fā)，必須使用團隊的簽名。
4.運行創(chuàng)建的flutter項目；
選擇真機、模擬機，點擊運行按鈕，或使用命令運行：
下面兩步是贈送的：
5.新加一款插件，所涉及的命令；
ios 端所涉及的命令
6. 剛更新的插件和已有的插件有沖突怎么辦？
可以試一試以下步驟：
前言
為什么跨平臺是發(fā)展趨勢？
同一個應用，各個“端”獨立開發(fā)，不僅開發(fā)周期長，而且人員成本高。同時，作為技術人員，也不應該滿足于這種重復、低能的工作狀態(tài)。在這樣的形勢下，跨平臺的技術方案也受到越來越多人和企業(yè)的關注。
本篇文章我將從原理、優(yōu)缺點等方面為大家分享跨平臺技術
一. H5
說到跨平臺，沒人不知道H5。不管是在Mac、Windows、Linux、iOS、Android還是其他平臺，只要給一個瀏覽器，連“月球”上它都能跑。
1.瀏覽器架構
下面，我們來看看讓H5如此橫行霸道的瀏覽器的架構：
瀏覽器由以上7個部分組成，而“渲染引擎”是性能優(yōu)化的重中之重，一起了解其中的渲染原理。
2.渲染引擎原理
不同的瀏覽器內核不同，渲染過程會不太一樣，但主要流程還是一致的。
分為下面6步驟：
從以上6步，我們可以總結渲染優(yōu)化的要點：
以上就是瀏覽器端的內容。但H5作為跨平臺技術的載體，是如何與不同平臺的App進行交互的呢？這時候JSBridge就該出場了。
3.JSBridge原理
JSBridge，顧名思義，是JS和Native之間的橋梁，用來進行JS和Native之間的通信。
通信分為以下兩個維度：
那么App內加載H5的過程是什么樣的呢？
4.App打開H5過程
打開H5分為4個階段：
這四步，對應的過程如上圖所以，我們可以針對性的做性能優(yōu)化。
5.優(yōu)缺點分析
下面，我們進行H5的優(yōu)缺點分析：
優(yōu)點
缺點
雖然H5目前還存在不足，但隨著PWA、WebAssembly等技術的進步，相信H5在未來能夠得到越來也好的發(fā)展。
二.小程序
2018年是微信小程序飛速發(fā)展的一年，19年，各大廠商快速跟進，已經有了很大的影響力。下面，我們以微信小程序為例，分析小程序的技術架構。
小程序跟H5一樣，也是基于Webview實現(xiàn)。但它包含View視圖層、App Service邏輯層兩部分，分別獨立運行在各自的WebView線程中。
1.View
可以理解為h5的頁面，提供UI渲染。由WAWebview.js來提供底層的功能,具體如下：
每個窗口都有一個獨立的WebView進程，因此微信限制不能打開超過5個層級的頁面來保障用戶體驗。
2. App Service
提供邏輯處理、數據請求、接口調用。由WAService.js來提供底層的功能,具體如下：
運行環(huán)境：
僅有一個WebView進程
3.View App Service通信
視圖層和邏輯層通過系統(tǒng)層的JSBridage進行通信，邏輯層把數據變化通知到視圖層，觸發(fā)視圖層頁面更新，視圖層將觸發(fā)的事件通知到邏輯層進行業(yè)務處理。
4. 優(yōu)缺點分析
優(yōu)點
缺點
既然WebView性能不佳，那有沒有更好的方案呢？下面我們看看React Native。
三.React Native
RN的理念是在不同平臺上編寫基于React的代碼，實現(xiàn)Learn once, write anywhere。
Virtual DOM在內存中，可以通過不同的渲染引擎生成不同平臺下的UI，JS和Native之間通過Bridge通信
1.React Native 工作原理
在 React 框架中，JSX 源碼通過 React 框架最終渲染到了瀏覽器的真實 DOM 中，而在 React Native 框架中，JSX 源碼通過 React Native 框架編譯后，與Native原生的UI組件進行映射，用原生代替DOM元素來渲染，在UI渲染上非常接近Native App。
2.React Native 與Native平臺通信
3.優(yōu)缺點分析
優(yōu)點
缺點
4.RN展望
雖然RN還存在不足，但RN新版本已經做了如下改進，并且RN團隊也在積極準備大版本重構，能否成為開發(fā)者們所信賴的跨平臺方案，讓我們拭目以待。
既然React Native在渲染方面還擺脫不了原生，那有沒有一種方案是直接操控GPU，自制引擎渲染呢，我們終于迎來了Flutter！
四.Flutter
Flutter是Google開發(fā)的一套全新的跨平臺、開源UI框架，支持iOS、Android系統(tǒng)開發(fā)，并且是未來新操作系統(tǒng)Fuchsia的默認開發(fā)套件。渲染引擎依靠跨平臺的Skia圖形庫來實現(xiàn)，依賴系統(tǒng)的只有圖形繪制相關的接口，可以在最大程度上保證不同平臺、不同設備的體驗一致性，邏輯處理使用支持AOT的Dart語言，執(zhí)行效率也比JavaScript高得多。
1.Flutter架構原理
2.Dart優(yōu)勢
很多人會好奇，為什么Flutter要用Dart，而不是用JavaScript開發(fā)，這里列下Dart的優(yōu)勢
3.優(yōu)缺點分析
優(yōu)點
缺點
在原生開發(fā)中， Android 使用 Gradle 來管理依賴， iOS 用 Cocoapods 來管理依賴，Node 中通過 npm來管理依賴。 Flutter 使用配置文件 pubspec.yaml （位于項目根目錄）來管理第三方依賴包。
Pub 是Google官方的Dart Packages倉庫，類似于node中的npm倉庫，android中的jcenter，我們可以在上面查找我們需要的包和插件，也可以向pub發(fā)布我們的包和插件。
Pub工具 包含管理Package、部署Package和部署命令行應用的命令。
如果使用的是Flutter SDK，不要直接使用pub命令。而是使用flutter pub命令，如下：
命令pub get/upgrade/outdated 屬于管理Package的依賴關系
用于檢索當前 Package 所依賴的其它 Package。如果 pubspec.lock 文件已經存在，則根據該文件中保存的依賴項版本獲取對應的依賴項。如有必要，將會創(chuàng)建或更新該文件。
更新 package 依賴
當你添加一個 package 后首次運行 flutter pub get， Flutter 將會保存在 pubspec.lock lockfile 中找到的具體 package 版本。這將確保當你或者團隊中其他開發(fā)者運行 flutter pub get 后能得到相同版本的 package。
如果你想升級到 package 的最新版本，比如使用 package 的最新特性，請運行 flutter pub upgrade 。這將檢索你在 pubspec.yaml 文件中指定的版本約束所允許的最高可用版本。
案例
在flutter項目中導入hive包，在pubspec.yaml文件中添加配置：
執(zhí)行flutter pub get，可以在 pubspec.lock 中看到 hive 版本是2.1.0，這是因為目前hive的最新版本是2.1.0,配置“^”表示向最新版本兼容，具體可查看Package版本管理（ ），所以再執(zhí)行flutter pub upgrade 可以看到版本還是2.1.0，這個時候會發(fā)現(xiàn)pub get和 pub upgrade 效果一樣。
但是未來如果 hive 發(fā)布了2.2.0版本，這個時候使用flutter pub get在pubspec.lock中看到hive版本依舊是2.1.0，而執(zhí)行flutter pub upgrade 后在pubspec.lock中看到hive版本就是2.2.0。
現(xiàn)在先在flutter 項目的pubspec.yaml文件添加配置，指定hive版本是2.0.5，如下：
這個時候執(zhí)行flutter pub get后，可以在pubspec.lock的文件中看到hive版本是2.0.5，如果這個時候更改配置為 hive: ^2.0.5，再執(zhí)行flutter pub get就會發(fā)現(xiàn)在pubspec.lock的文件中看到hive版本還是2.0.5，這個時候可以執(zhí)行flutter pub outdated查看依賴的每個 package，如下圖，
可以看到，Upgrable項hive版本號為2.1.0，執(zhí)行flutter pub upgrade 后可以看到在pubspec.lock的文件中看到hive版本是2.1.0
在pubspec.yaml文件添加配置：
lxx_package_demo信息如下圖：
執(zhí)行flutter pub get后在pubspec.lock中看到flutter_log版本是0.0.1
現(xiàn)在修改lxx_package_demo版本號為0.0.2，再執(zhí)行flutter pub get
會發(fā)現(xiàn)版本會及時更新為0.0.2，這個時候執(zhí)行flutter pub get/upgrade效果一樣
參考文檔：
重慶分公司
重慶分公司
