客戶端軟件GUI開發技術漫談：原生與跨平臺解決方案分析

原生開發應用開發

Microsoft陣營的

Winform

WinForm是·Net開發平臺中對Windows Form的一種稱謂。

若是你想深刻的美化UI，須要耗費很大的力氣，對於目前主流的CSS樣式表來說，美化Winform的界面以及自定義控件是須要耗費更多的時間的。

WPF

基於XML+C#+CSS的呈現方式讓它在UI上有了更加靈活的設計寬度

WPF和WinForms是兩種徹底不同的UI技術，WPF也並不能徹底取代WinForms。

WPF不能運行在其餘操做系統，而且在XAML中編寫樣式表，通用性仍是不如HTML強，從學習應用的範圍來說，仍是HTML更好一些。

UWP

微軟爲了針對移動端市場開放的開發框架，若是你的APP只須要運行在Windows下，我認爲WPF或者UWP是最好的選擇，畢竟在調用系統原生API上微軟的親兒子們有着巨大的優點。

windows上各類各樣的技術開發的IDE和其餘程序

• 性能上：Java最差 -> Electron -> WindowsForms -> 原生 -> WPF

• 佔內存：Java最多 -> Electron -> WPF -> WindowsForms -> 原生

Java陣營

Swing

零幾年學Java的老頭子們幾乎都是從Swing開始學起的，Swing謎通常的默認UI審美觀讓我直接放棄了繼續學習下去的動力。

JavaFx

優勢在於能夠跨平臺，缺點在於整個生態環境很是很差，與Winforms同樣，自定義一些控件相對比較困難。

Adobe陣營

Air

Flex程序，它的優勢在於能夠跨平臺，能夠基於Flash作出不少超級炫酷的動畫特效，可是缺點主要就是效率實在是過低下了，而且在調用操做系統原生API的時候也很是不方便。隨着Flash在瀏覽器上的節節敗退，Air也悄無聲息的消失在了大衆的視野當中。

Apple

Objective-C（或如今的Swift），跟Winforms同樣，能夠很是方便的調用操做系統底層API，劣勢也同樣，不跨平臺、自定義控件比較複雜，可用資源太少。如今大多數程序員都是基於C#、Java進行開發，若是不是Apple死忠，根部不會花大力氣研究

跨平臺軟件應用開發

直接元素開發確定是最好的——這樣的性能確定最有保證，可是跨平臺的主要優點在於代碼邏輯的複用，減小各平臺同一邏輯，因人而異的開發成本。對於企業而言，一套業務邏輯能夠在多處使用是最理想也是最保險的。

Electron

Electron是由Github開發，用HTML，CSS和JavaScript來構建跨平臺桌面應用程序的一個開源庫。 Electron經過將Chromium和Node.js合併到同一個運行時環境中，並將其打包爲Mac，Windows和Linux系統下的應用來實現這一目的。經過Node它提供了一般瀏覽器所不能提供的能力。

electron的特色就是能夠複用前端的各類輪子。因此它開發快，招人方便。

能夠方便的經過Node.JS調用系統API、可使用SQLite作本地字典項的緩存處理，能夠將複雜的計算邏輯放在客戶端進行，從而減輕服務器端的壓力等等。

electron都成千上萬個成熟項目在桌面裏用了，什麼flutter，javafx，swiftui，目前仍是沒法比

electron和node-webkit（如今叫nw.js）的區別：

。從概念上，Electron與nw.js很類似，可是他們有很重要的區別：一個主要的不一樣點是Electron 經過 Googles Chromium Content Module 來使用 Chromium 的功能，nw.js 則直接使用了 Chromium自己。

electron創建在 Chromium 和 NodeJS 之上的，一個負責界面，一個負責背後的邏輯

Cordova，PhoneGap

Cordova[ˈkɔːdəbə]是 hybride 類框架，基於HTML，CSS和JavaScript的，建立移動跨平臺移動應用程序的快速開發平臺

2011年10月4日Adobe公司收購了PhoneGap和PhoneGap Build的新創公司Nitobi Software，隨後將Phonegap的核心代碼剝離並捐給了Apache公司，並更名爲了Cordova。

核心的東西就是H5與Native的交互原理、Bridge、定義的解析規則（Engine）

Cordova Application是Cordova框架獨立於不一樣手機操做系統的一個封裝層。具體包括

• Web App層是開發人員編寫代碼的主要地方，應用程序以網頁的形式呈現，在一個index.html的本地頁面文件中引用所須要的各類Web資源，如CSS、JavaScript、圖像、影音文件等。應用程序的配置保存在config.xml文件中。

  對於使用cordova cli初始化的web app 在主目錄下會存在一個config.xml，其中包含了整個app的一些基本信息：好比appName、app入口文件、白名單、webview初始化的一些配置、plugin信息、圖標資源信息

• WebView層用來呈現用戶界面，即web頁面的展示。例如，在Android平臺是經過WebView控件實現web頁面的呈現。
  

• Plugins主要用於在JavaScript代碼中調用各平臺native的功能。Cordova項目已經包含一些核心的plugin，如電池、攝像頭、通信錄等。開發人員也能夠開發自定義的plugin，來實現所須要的功能。
  

Mobile OS就是具體的手機操做系統層

Cordova預先幫咱們預先封裝了各類mobile os上最經常使用的本地api調用，而後以統一的JavaScript api形式提供給webapp開發者調用。

對於webapp的開發者來講，無需關注系統底層調用實現細節，也就實現了所謂的「跨平臺」。實際上，各平臺涉及到本地能力的調用，以插件形式被封裝了。（每一個插件的實現實際上仍是Native模式）。

JS和Native是如何實現互調的，這裏先研究安卓的

Cordova-Android是經過addJavascriptInterface（Android Webview的API）和JS Prompt這兩種方式來實現JS對於Native API的調用。

咱們先來看一個Cordova-Android框架中的一個關鍵類： CordovaActivity.java。

該類繼承了Android Activty類，其實是Cordova-Android的Launcher Activity，也就是啓動入口activity。

應用啓動後，核心幹了兩件事：讀取config.xml和loadUrl。這個loadUrl實際上就是加載webapp的啓動頁（默認是index.html）。

IOS具體參看《Cordova 工做原理(IOS篇)》，這裏關於原理這是簡介。

Xamarin

Xamarin ['zæmərɪn]是一個開放源代碼平臺，用於經過 .NET 構建適用於 iOS、Android 和 Windows 的新式高性能應用程序。

Xamarin主要有這麼幾項技術，Xamarin.Android、Xamarin.iOS和Xamarin.Forms，此外還有Xamarin.UWP、Xamarin.Windows、Xamarin.WinPhone等。本質都是對原生API作了一層C#的封裝，所以在使用上與原生API會十分類似。這種封裝會結合一些C#的語法特性，讓開發者能夠享受C#的語法糖。Xamarin.iOS是直接編譯成ARM的二進制代碼，所以執行效率確定是很是高的。

Xamarin.Android被編譯成中間語言，Xamarin在APK安裝包中會包含一個mono（跨平臺的.NET運行環境），代碼是在mono運行時和安卓本地的運行時上完成工做的。

Mono [ˈmɒnəʊ] 虛擬機包含一個實時編譯引擎，該引擎可用於以下處理器：x86，SPARC，PowerPC，ARM，S390（32位模式和64位模式），x86-64，IA64 和64位模式的 SPARC。該虛擬機能夠將代碼實時編譯或者預先編譯到原生代碼。對於那些沒有列出來的系統，則使用的是代碼解釋器。

Xamarin 是一個抽象層，可管理共享代碼與基礎平臺代碼的通訊。 Xamarin 在提供便利（如內存分配和垃圾回收）的託管環境中運行。

Xamarin始創於2011年，旨在使移動開發變得難以置信地迅捷和簡單。

Xamarin 適用於具備如下目標的開發人員：

• 跨平臺共享代碼、測試和業務邏輯。

• 使用 Visual Studio 在 C# 中編寫跨平臺應用程序。

Xamarin 容許在每一個平臺上建立本機 UI，並在 C# 中編寫跨平臺共享的業務邏輯。 在大多數狀況下，80% 的應用程序代碼可以使用 Xamarin 進行共享。

Xamarin最爲關鍵的技術Xamarin.Forms，把IOS、android、UWP等平臺的GUI進行了一統地抽象，開發者只須要寫一套代碼，編譯器會在編譯時將界面映射到原先控件上，從而得到原平生臺的外觀和性能。

Xamarin 在 .NET 的基礎之上進行構建，它自動處理諸如內存分配、垃圾回收以及與基礎平臺的互操做性等任務。

Xamarin以前是收費的，並且聽說收費不菲，因此使用的人數比較少，在國內幾乎無人問津。後來Xamarin被微軟收購，現已免費開放，可是從白學.net開始，就對微軟的東西不感冒了。微軟的東西雖好，可是叫好不叫座。

Flutter

flutter 其實就是一套谷歌開源的跨平臺 UI 開發框架，支持 Android 和 iOS ，而且目前開始支持 Web 和 MacOS，將來還會繼續支持 Win和 Linux 平臺的一套 UI 框架。

Dart UI是一個 C++實現的 dart:ui庫的 Native Binding，而且 UI Lib也是 Dart GUI程序的應用主要入口。

Dart UI向上層提供了 window、text、canvas、geometry等通用的繪圖能力， Runtime在調用 Dart UI時，Dart UI根據傳遞的 main entrypoint 來執行而且向 window渲染圖像。

react-native 、weex 和 flutter 都只是 UI 框架，它解決的實際上是跨平臺上的 UI 實現，讓界面佈局或者實現的業務邏輯能夠在多端統一。可是它也僅僅只是 UI 框架，好比 react-native 自己就是依賴於原生控件，而 flutter 的 webview 、mapview 也都須要依賴原生開發來支撐。

Dart這門語言最初就是一幫Java程序員爲了方便寫UI搞出來的。若是大家團隊Java/Swift程序員比較多，那Flutter從上手方面來講更快。

爲何選擇Dart

• Dart 的性能更好。Dart在 JIT模式下，速度與 JavaScript基本持平。可是 Dart支持 AOT，當以 AOT模式運行時，JavaScript便遠遠追不上了。

• Native Binding。在 Android上，v8的 Native Binding能夠很好地實現，可是 iOS上的 JavaScriptCore不能夠，因此若是使用 JavaScript，Flutter 基礎框架的代碼模式就很難統一了。而 Dart的 Native Binding能夠很好地經過 Dart Lib實現。

• Fuchsia [ˈfjuːʃə] OS內置的應用瀏覽器就是使用 Dart語言做爲 App的開發語言。並且實際上，Flutter是 Fuchisa OS的應用框架概念上的一個子集。

• Dart是類型安全的語言，擁有完善的包管理和諸多特性。Google召集了如此多個編程語言界的設計專家開發出這樣一門語言，旨在取代 JavaScript，因此 Fuchsia OS內置了 Dart。Dart能夠做爲 embedded lib嵌入應用，而不用只能隨着系統升級才能得到更新，這也是優點之一。
  

Skia是什麼？

Skia是一個 2D的繪圖引擎庫，其前身是一個向量繪圖軟件，Chrome和 Android均採用 Skia做爲繪圖引擎。Skia提供了很是友好的 API，而且在圖形轉換、文字渲染、位圖渲染方面都提供了友好、高效的表現。Skia是跨平臺的，因此能夠被嵌入到 Flutter的 iOS SDK中，而不用去研究 iOS閉源的 Core Graphics / Core Animation。由於Android自帶了 Skia，因此 Flutter Android SDK要比 iOS SDK小不少。

QT C++

QT最大的優點就是跨平臺！高效率！可是與Objective-C同樣，CPP如同一座小山橫在了衆多server side程序員的面前，若是沒有CPP這道小山橫貫在前，我認爲QT是最好的Desktop Application特別是嵌入式終端的UI開發框架。

QT另外有一個優點在於，它在UI上彷佛要比以前幾位要方便一些，在它的QML中甚至能夠直接使用JavaScript（固然，Java也內置了JS引擎），同時QT中也包含了大量的標準CSS樣式表可使用

若是但願本身從事真正意義上的Desktop Application development，QT絕對值得你去學習。

QT有可視化編輯器，可是相比較而言，可能略強於NetBeans的Swing，可是跟VS比起來仍是差太遠了，不過大可能是實際開發都是基於代碼的

x-platform

這玩意，我的以爲沒有啥奔頭。

參考文章：

快速瞭解Electron：新一代基於Web的跨平臺桌面技術 www.cnblogs.com/imstudy/p/1…

Flutter原理簡解 zhuanlan.zhihu.com/p/36861174

轉載本站文章《客戶端軟件GUI開發技術漫談：原生與跨平臺解決方案分析》,
請註明出處：www.zhoulujun.cn/html/webfro…