一直以來，效率都是互聯網企業的生命線。而“通過技術升級實現三個人幹五個人的活，賺四個人的工資”是企業和個人一直渴望達到的雙贏局面。
隨著行業競爭加劇，為進一步提升開發效率，跨平臺開發逐漸的成為了互聯網行業的剛需。
這樣的大趨勢下，一些頭部互聯網公司基於自身技術背景和當時技術條件，推出了不同類型的跨平臺解決方案。
根據技術類型歸納為以下幾類：
JS+Web View渲染
課代表：PhoneGap(Adobe)
這種技術 UI 渲染完全交給 Web View，通過 Bridge 給 Web View 增加了拍攝器、GPS、通信錄等功能。
優點：完整的 web 體驗，前端同學開發效率高。
缺點：性能跟原生有巨大差異。
JS+ 原生 UI 渲染
課代表：React Native(FaceBook)，Weex(阿里)
GItHub 地址：
https://github.com/facebook/react-native
開發技術仍然使用 JS 等 Web 元素，但 UI 渲染、動畫、網絡等都通過原生實現。JS 到原生的調用通過 JS 橋接器實現。
優點：
1. 體驗跟原生保持一致，Web 開發上手門檻稍低。
2. 一定程度提升了性能。
缺點：
1. Android、iOS 原生開發者學習成本高。
2. 礙於 JS 虛擬機和 JS 橋接器跟原生性能差距仍然較大。
基於圖形引擎渲染（拋棄原生UI）
課代表：flutter(谷歌)
GitHub 地址：
https://github.com/flutter/flutter
著名的 Cocos2d-x 也在這個陣營，該框架已經不依賴 web 技術，也不依賴原生提供的 UI 框架。通過圖形引擎自己實現渲染。
優點：
1. 擺脫系統 UI 約束，容易實現不同平臺代碼一致性。
2. 設計方案有創新性。
缺點：
1. 從 Dart 學習成本到 UI 佈局的複雜度，都在明顯拉低開發效率。
2. 不支持熱更新。
基於原生 UI 渲染（差異部分圖形引擎抹平）
課代表：MLN(陌陌)
GitHub 地址：
https://github.com/momotech/MLN
MLN 剛在 GitHub 開源，名字聽起來還很陌生。開發語言使用在遊戲領域大火的 Lua（開發了你熟悉的魔獸爭霸、憤怒小鳥），具有速度快、易上手的特點。頁面佈局使用客戶端開發熟悉的 FrameLayout、LinearLayout。
優點：
1. 客戶端開發上手極快。
2. 性能好，貼近原生效果。
缺點：
新推出主要應用於陌陌，缺少第三方驗證。
跨平臺技術該如何選擇？
而這些跨平臺框架的誕生，都有著自己的技術背景。只有選對了場景才能發揮出他們真正的威力。
1. 做短期運營活動頁面
這種頁面更像快消品，活動過後兩三天就下線。運營、產品同學更看重展示效果和如期上線。這時候 PhoneGap 類的 web 技術就是很務實的選擇。這類技術因為門檻低很多公司都有自己的技術框架。
2. 以 Web 程序員為主的團隊
建議有實力的團隊選擇 React Native、Weex 類框架。這類產品可以很大程度複用 web 程序員的開發經驗，但是也需要有較強技術實力的客戶端開發的支持。比如性能優化，定製化開發。
3. 以客戶端程序員為主的團隊
1）這裡排除了 React Native 和 Weex。JS、VUE 這些 web 技術通常需要客戶端程序員花一週左右時間上手，另外寫代碼思維方式的轉變，一段時間內也會繼續拖慢開發效率。
JS 虛擬機和 JS 橋接器對性能的嚴重消耗也讓這類技術性能上跟原生差距較大。
2） Flutter 也沒能扛起高性能、高效率這杆大旗。而且不支持熱更新讓很多注重迭代效率的互聯網企業無法接受。
且不說 Dart 語言學習成本和 UI 佈局的複雜性，網上搜索和我自己的性能評測中 Flutter 也一直沒能兌現它宣稱的高性能。
3）相比之下，MLN 對客戶端開發者極其友好。Lua 簡潔的類 C 語法，基本不會對客戶端開發者造成任何障礙。
線性佈局、frame 佈局，讓客戶端開發者覺得使用 MLN 只是給原本熟悉的UI框架換了個命名規則。原來的開發經驗可以直接遷移過來。
infoView = LinearLayout(LinearType.VERTICAL)
infoView:setGravity(Gravity.CENTER_VERTICAL)
contentView:addView(infoView)
熱重載功能方便實用，隨時看到代碼執行效果對提高 UI 開發效率幫助很大。通過官方 demo 做的性能測試，MLN 也是所有框架中性能最接近原生的。
MLN 從一線互聯網公司、一線開發人員的真實需求出發，務實的解決了一系列開發中的性能、效率問題。值得向大家推薦。
性能對比
到了性能對比這個相互傷害的環節了：
相關數據可以從上文中 GitHub 地址下載 demo 對比驗證
以上數據可以看到，MLN 跟其他主流產品相比有顯著的性能優勢。一方面得益於 Lua 虛擬機的高性能。另外 MLN 的懶加載、基於 mmap 的緩存等設計也起到了明顯效果。
在安卓低端手機 oppo A3 上調用 1000 次 Lua 橋接器耗時 60 多毫秒，而 1000 次 JS 橋接器通常要 1400 毫秒左右。Lua 的高性能給了 MLN 更多的設計空間。
同時值得稱讚的是，MLN 的懶加載模式非常實用。很多功能可能 UI 展示部分只有幾 K 代碼量，而背後的控制狀態切換、用戶信息 merge、數據獲取等複雜業務邏輯卻有幾十、幾百 K 代碼。代碼結構處理不好很容易拖慢頁面展示速度。
MLN 懶加載功能，在單獨的 Loop 循環裡優先處理讓用戶看到的內容。可以做到不管業務邏輯多複雜，頁面都能飛快展示。
另外，MLN 的 KV 存儲模塊 MLNKV 也單獨開源了（https://github.com/momotech/MLNKV）。MLNKV 通過 mmap、雙緩存策略、記錄偏移量的value存儲等技術實現了高性能和低內存佔用並存。從多項性能指標統計來看，MLNKV算得上業內最高效的KV存儲模塊。
技術選型+精心設計造就了MLN的高性能。
MLN未來技術規劃
MLN 剛剛開源，在工具鏈支持和功能豐富程度上跟一些老牌跨平臺框架相比仍有缺失。但是從 GitHub 上 MLN 的規劃設計看，很多功能正在開發中。從很多計劃裡可以看出廠商頗有誠意。
1. 繼續保持性能領先
1）支持無侵入性異步 measure (in progress)
2）列表控件加入無侵入性智能預加載(backlog)
3）近期加入聲明式 UI 給開發者更多選擇(in progress)
以上這些完成後 MLN 性能可能會超過大多數原生應用。
2. 功能豐富才能真正提高開發效率
提供豐富的類庫支持才能真正幫助業務開發提高開發效率，否則跨平臺框架很可能淪為少數極客的玩具。MLN 計劃官方支持：
網絡、svga 動畫、分享、圖片異步加載等業務開發常用類庫的橋接，以後會逐步加入更多功能。
工具鏈支持（以下功能會集成在插件中）：
1）模擬器(in progress)
2）代碼測試覆蓋率（in progress）
3）性能檢測（backlog）
4）升級斷點調試（in progress）
3. 支持到位的技術才有生命力
MLN 正在把陌陌內部社區遷移到 GitHub，對內外部的 issue 等提供一致的支持。
總結
以上是對跨平臺開發技術的年末盤點。放大到行業層面來看，一是國內的互聯網行業競爭激烈，企業需要不斷創新、快速試錯，敏捷應對市場的變化和需求；另一方面，端的融合已經成為一個越來越明顯的趨勢，統一的開發模式和開發體驗已經是大前端發展的明確方向。
正因為我國的特殊市場環境，也給了我們一個技術發展彎道超車的機會。而能否把握住這個機會，離不開每一位開發者的參與、每一家技術廠商的投入付出。
SegmentFault 作為國內新一代的技術社區，希望可以和國內的開發者、技術廠商一起，共同營造一個屬於中國開發者最好的時代。
閱讀更多 SegmentFault 的文章
