怎麼評價國產框架MUI跟ReactNative的對比帖?

非廣告貼,題主只是一個比較好奇而已..

剛看到一篇 MUI 跟RN 對比的帖子, 因為對兩家的東西沒有深入的掌握,所以問下大家如何評價這個對比貼.

鏈接: 文檔 - DCloud問答

------------------------------------------------------------------------

這個帖子的最後一段是這麼說的:

HTML5需要強化毋庸置疑,但到底該怎麼強化?

一種是重訂語法重寫引擎,一種是把HTML5不流暢的部分使用原生動畫補齊。很明顯後者的方向更靠譜。

一個HTML5移動站,通過5+略加改造就可以變成原生體驗的App。但如果是react native,就需要重頭學重頭寫,代價高昂,收益卻沒有提升多少。

功能:5+遠大於react native

性能:兩者各有千秋,5+的plus擴展部分&>react native&>純HTML5部分

包體積:5+遠小於react native

OS支持範圍:5+大於react native

國內開發者支持:5+優於react native

長期演進生命力:react native像過渡產品,隨著手機硬體的提升,該項目存在的意義在下降

----------------------------------------------------------------------------

如果真如他所說的這樣,我很想知道為什麼在RN圈活躍的開發者們比MUI多...

如果MUI真如帖中說的那麼強於RN,為什麼它沒有火起來,只是因為開發團隊沒有FaceBook的名氣大么.

----------------------------------------------------------------------------

我下載了他家的演示APP ,發現對原生的各種實現簡直無可挑剔

HTML5+ - DCloud

-------------------------------------------------------------------------------

還為了體驗下面鏈接中的流應用, 專門去下載了360手機助手, 秒安裝的APP 雖然不太流暢,可是感覺這個秒裝立馬就能用的功能實在太棒,為什麼會沒有流行起來呢.

流應用 - DCloud


感覺是廣告題呢,大概看了下,所謂 html5+ 不就和 Cordova 差不多麼... 流暢度什麼的無非就是用 CSS transform 唄,也不用裝那麼神秘... 雖然 CSS transform 用得好確實可以做出媲美原生的 UI,但要說得彷彿一定要用貴產品才能做到就不厚道了。

和 ReactNative 的對比槽點太多,唯一贊同的一點就是長線來說 RN 的意義是逐步下降的。

---

嗯,又仔細看了看,5+ runtime 在性能方面確實有一些特別的考慮,我收回上面 CSS transform 那一段。基本上總結起來一句話,就是多個 webview。在一些特定的地方,比如列表、下拉刷新,利用一些低版本 Android 上 webview 的滾動性能優於單個元素 overflow: scroll 的性能這一點,用多個 webview 來規避滾動性能問題。這個確實解決了國內 hybrid 開發的一些痛點,但是 webview 方案並不是從本質上解決了 hybrid 性能的問題,難道切屏、滾動、下拉刷新就囊括了所有的『動畫效果』了?這也太小看交互設計師了吧。在 webview 內部 5+ 其實和普通的 hybrid 沒有什麼區別,原本會卡的 HTML5 動畫並不會神奇地就不卡了。另一方面來說,這些性能問題其實大部分只在低版本 Android 上面存在,所以這些所謂的性能增強的意義其實也是隨著手機硬體的提升在下降嘛...

我覺得 5+ runtime / Native.js 和多 webview 方案思路還是不錯的,但是在文案上... 可以少一些『吊炸天』的即視感,語氣更平和實在一些。

至於 MUI 框架,設計思路實在是比較滯後了,開發體驗比較捉急,樓下有人提到了。不過 5+ 並不一定要用 MUI 框架吧,其實我覺得主推 runtime,做 Cordova/RN/NativeScript 的競爭者就好,上層 UI 框架這種東西變化很快,保持靈活性更好。


利益相關:兩個都用過,都開發過中等大小的應用

————

先下結論:MUI是國內優秀的跨平台開發框架,或許是最優秀的

曾用它做discuz論壇通用的app,包括讀帖,發帖,評論等一系列內容

優點:簡單到不能再簡單了,遇到不懂的再看文檔完全沒問題(都是現成組件)

最符合人習慣的開發方式是什麼,就是一個標籤一個標籤地寫頁面,這也是web開發最初的形式,哪像現在,我在項目里寫了三個月js還不知道它是幹嘛的

對於頁面不多,交互簡單的移動端,我是提倡這種方式的

拿一個簡單的頁面跳轉為例,分別看看兩者怎麼實現

MUI

mui.openWindow({
url:"info.html",
id:"info.html",
extras:{//頁面間傳值
name:"mui",
version:"0.5.8"
}
});

簡單明了

RN

renderImages: function() {
return (
&
);
},

//再看myview
var MyView = React.createClass({
bigImage : function(){
this.props.navigator.push({
title: "title",
component: NavigatorIOSExample,
rightButtonTitle: "保存",
leftButtonTitle: "返回",
onLeftButtonPress:() =&> this.props.navigator.pop(),
onRightButtonPress:()=&> this.PressSave()
});
},
.......
.......

我覺得RN使用Pop和PUSH的方法是沒問題的,但我還是覺得前面直接url定向簡單

你可以說pop和push容易管理,而我只是覺得這僅僅是RN幫你做了一部分事情而已

MUI的各種組件有點web component的味道,不同之處一個用css類來封裝,一個用新的html標籤封裝

在調試方面,MUI/HBuilder要比RN更友好,我不需要花一下午把我的xcode升級到7.2就可以使用模擬器,安卓的打包也可以在線完成

ok,優點說完了,下面說說缺點,在性能上的表現,一個WebView裡面嵌套一個scrollView後,MUI在安卓機上的表現就有點不如人意了,同樣的場景RN還未發現問題

綜上,如果再讓我選一次的話

我選RN

因為說實在的,用過RN createClass的寫法之後,真的沒勁再去寫一個個html頁面了

也不用每個html一個css文件,第一段一定是

*{
margin:0px,
padding:0px
}

MUI自我標榜靈活性,但在簡潔性上輸了RN一截,這麼說其實有點冤枉,這應該是html和css的債,不該由MUI背,RN的組件化理念是要高於MUI的

----------

回答題主的問題

1.為什麼活躍度不如RN?

facebook出得嘛,大家懂不懂都願意跟風看看fb有了什麼新玩具

而且恕我直言,RN中文社區的活躍度極其一般,不少文檔翻譯到一半丟那裡了害我還得找官網

2.MUI還有沒有可以改進的地方?

肯定有,如果不是css組件化而是標籤組件化的話,我想我會更喜歡它

例子:

一個MUI的tabbar,這是基友寫的,輕噴

&

網頁上長得令人髮指的id和class是用什麼實現的,又是基於怎樣的原因?
怎麼看待一個阿里工作四年出來的,但卻連children()這樣的方法都不知道是什麼意思的前端?
為什麼我將知乎文章保存在本地後不能打開?
英語是否會成為開發工程師的發展瓶頸?
沒有為 position: absolute 元素賦予 left、top 等值,與賦予 left:0; top:0; 的效果為何不一樣?

TAG:前端開發 | JavaScript | Nodejs | HTML5應用 | ReactNative |