https://juejin.im/post/6844904118901817351
https://uniapp.dcloud.io/
技术学习成本和难度
rn,要求开发者学习react,要求精通flex布局,要求原生开发协作。
flutter,要求开发者学习dart,了解dart和flutter的API、要求精通flex布局,要求原生开发协作。
weex已经内嵌到uni-app中,就不单独提了。
uni-app,要求开发者学习vue,了解小程序。
很明显uni-app的学习成本太低了,它没有附加专有技术,全部使用公共技术。
学习成本和难度,直接意味着:开发成本、招聘成本、上线速度、上线风险。
另外,dart究竟值不值得学,是一个大问题。
Google的天才工程师也发明了go语言,它确实有很多理论优势,但实际上市场的主流,仍然是c和c++。
质量
这几种跨平台引擎,整体的质量水平是差不多的,都是可以商用,但是有各种小坑。
2020年7月6日的数据,各家的github的issues如下:
框架
issues
uni-app
557
react native
816
flutter
7840
代码量是flutter最多,对应它的issues的数量也越多。
对于uni-app和react native来讲,渲染层是基于相对成熟的原生渲染或webview渲染来做的,不像flutter一切都是自己实现。而逻辑层uni-app也使用相对成熟的v8和jscore,出问题的点相对要少。
各框架的更新都比较频繁,真的有影响商用的大问题,肯定都会及时修复。
目前各个框架都有较大的用户使用量,质量方面均是可控的。
生态
任何开发引擎,都离不开生态。
对于国外的开发者,rn、flutter的生态肯定比uni-app好,比如facebook登陆分享、Google地图等。
但对于国内的开发者,那是反过来的,中国开发者需要的全端推送(UniPush集成了iOS、华为、小米、OPPO等众多原厂推送)、各种国内登陆、支付、分享SDK、各种国内地图、各种ui库、以及Echart图表等,都是在uni-app体系里,这方面生态可比rn、flutter丰富多了。uni-app的插件市场有数千款插件,不能说应有尽有,但确实是最丰富的跨端开发框架生态了。
另外,uni-app的生态还比其他竞品强在如下方面:
App和H5提供了renderjs技术,使得浏览器专用的库也可以在App和H5里使用,比如echart、threejs等参考
兼容微信小程序 JS SDK,丰富的小程序生态内容可直接引入uni-app,并且在App侧通用,参考
兼容微信小程序自定义组件,并且App、H5侧通用,参考
这些丰富的生态兼容,是rn和flutter无法享受的。
其他端的跨端性
flutter和rn,都是支持web技术的。但都是仅限于普通界面排版,涉及定位、摄像头、相册什么的,是要单独写代码的。
另外flutter的H5版,嗯,作为中国开发者,你不会想要一个如此浓郁的Material风格的H5版的。。。
更何况这个Material ui库大的很,编译出来的H5版要十几M的体积。
uni-app的H5端是包含完善的能力引擎的,丰富能力都可以直接跨端使用,风格也是跨端风格。uni-app的H5引擎体积只有1百K,gzip后只剩下30k(不含vue、vue-router),比其他工具的引擎体积要小的多。
另外,中国离不开小程序,rn、flutter官方都不会支持小程序,由于架构差异太大,国内三方也做不到把rn代码良好的编译为小程序代码。uni-app则可以一套代码,同时编译为iOS、Android、H5、微信小程序、支付宝小程序、百度小程序、头条小程序、QQ小程序。
结论
每种技术的诞生,有其背后公司的目的。
但凡没有明确公司战略的技术,除非是特别简单的技术,否则很难商用,因为为了商用要投入公司非常多资源。
flutter诞生的目的,是为了Fuchsia OS,是为了在下一个互联网大潮,即万物互联的物联网年代,提供一个类似Android在移动互联网位置的垄断性操作系统。
因为Google已经很明确不会在下一个时代使用Android+java的路线了。
至于在Android上去java化,那是Kotlin的使命,与flutter无关。
跨iOS和Android平台开发,这不是Google的战略目标。
但万物互联何时到来?Fuchsia OS何时流行?这在现实中是一个问号,在Google内部,也只是战略储备项目。
一个语言的流行,不是一件简单的事情,不是有优点,就会流行,它需要天时地利人和。
6年前我们就知道dart比js更好,dart不应该消亡,但想成为主流技术,太难太难了。
同样我们也知道go比c++更好,但go还是起不来。
想靠flutter驱动dart流行是不现实的,甚至是反过来的。跨iOS、Android开发在国外不是主流市场,这点价值造就不出一个这么难建的生态。
所以dart能否流行,是要打一个大大的问号的,它可能会像go语言一样,叫好不叫座。
一个跨平台公司,应当是中立的。而flutter在这个位置上很尴尬,它是google出品的、同时跨iOS和Android的开发引擎。
如果这个引擎做大了,Apple会怎么看?那可不是像微信搞个小程序那么简单了,微信是中立三方,且只在中国。Apple不会让google的flutter在iOS上做大的。大家也都知道,即便是chrome,在iOS上也只能使用iOS提供的内核,容不得google在iOS上乱搞的。
目前,flutter在国内一些大厂的原生App里得到了局部应用。这个应用场景,目的不是为了节省成本,flutter开发成本很高,生态也不完善,但因为性能高,一些大公司愿意负担这个代价来使用flutter,在原生app里部分页面使用flutter制作。但是这个场景,有个尴尬,就是flutter页面无法动态更新,但很多大app对动态发版的需求极强,有些厂商改造了flutter使其可动态发布,但又降低了flutter的性能。目前还没有一个完美的解决方案。
写了这么多,最后总结下flutter与uni-app的比较:
flutter与uni-app的相对优势:
性能好一丢丢。比rn有优势,但比拥有bindingx和wxs的weex/uni-app,在实际开发中没有很明显的差距。
flutter与uni-app的相对劣势:
需要原生协作,维护3套代码,无法有效降低开发成本,提升开发效率
嵌套地狱,代码难看难维护
不支持热更新
目前质量和成熟度很低
原生可视控件融合不好,比如webview、video、map
ui库不适合国情
学习成本高
应用场景有限,dart未来扑朔迷离
再总结下rn和uni-app的比较
rn与uni-app的相对优势:
rn的坑虽然比weex的少,但uni-app已经填了weex的很多坑。这方面差别不大。
rn的生态虽然比weex丰富。但uni-app是反过来的,uni-app的国内应用生态丰富度超过了rn。
rn是纯单页的,嵌入原生App比较灵活。而uni-app是应用整体的概念,如果要内嵌入其他原生应用的话,要求原生应用内嵌uni-app应用整体进来。即集成uni小程序sdk。
rn与uni-app的相对劣势:
需要原生协作,维护3套代码,无法有效降低开发成本,提升开发效率
不支持小程序,发布到h5也无法直接发
性能不如uni-app
国内的插件生态不如uni-app丰富
ui库不适合国情,learn once,write anywhere
学习成本高,用人成本高,不利于开发商降低开发成本
rn是纯单页应用,如果一个应用的页面很多,用rn写会很崩溃,变量污染和干扰严重。而weex/uni-app支持多页面,页面之间上下文隔离,写页面较多的大型应用更合适
另外react在中国的市场占有率远不如vue。这也是中国与国外不同的特色情况。
贴个vue、react、react native的百度指数对比,无论总体量的差距,还是发展趋势的下滑程度,可以明显看出react系在中国确实不行了。
欢迎使用Markdown编辑器
你好! 这是你第一次使用 Markdown编辑器 所展示的欢迎页。如果你想学习如何使用Markdown编辑器, 可以仔细阅读这篇文章,了解一下Markdown的基本语法知识。
新的改变
我们对Markdown编辑器进行了一些功能拓展与语法支持,除了标准的Markdown编辑器功能,我们增加了如下几点新功能,帮助你用它写博客:
- 全新的界面设计 ,将会带来全新的写作体验;
- 在创作中心设置你喜爱的代码高亮样式,Markdown 将代码片显示选择的高亮样式 进行展示;
- 增加了 图片拖拽 功能,你可以将本地的图片直接拖拽到编辑区域直接展示;
- 全新的 KaTeX数学公式 语法;
- 增加了支持甘特图的mermaid语法1 功能;
- 增加了 多屏幕编辑 Markdown文章功能;
- 增加了 焦点写作模式、预览模式、简洁写作模式、左右区域同步滚轮设置 等功能,功能按钮位于编辑区域与预览区域中间;
- 增加了 检查列表 功能。
功能快捷键
撤销:Ctrl/Command + Z
重做:Ctrl/Command + Y
加粗:Ctrl/Command + B
斜体:Ctrl/Command + I
标题:Ctrl/Command + Shift + H
无序列表:Ctrl/Command + Shift + U
有序列表:Ctrl/Command + Shift + O
检查列表:Ctrl/Command + Shift + C
插入代码:Ctrl/Command + Shift + K
插入链接:Ctrl/Command + Shift + L
插入图片:Ctrl/Command + Shift + G
查找:Ctrl/Command + F
替换:Ctrl/Command + G
合理的创建标题,有助于目录的生成
直接输入1次#,并按下space后,将生成1级标题。
输入2次#,并按下space后,将生成2级标题。
以此类推,我们支持6级标题。有助于使用TOC
语法后生成一个完美的目录。
如何改变文本的样式
强调文本 强调文本
加粗文本 加粗文本
标记文本
删除文本
引用文本
H2O is是液体。
210 运算结果是 1024.
插入链接与图片
链接: link.
图片:
带尺寸的图片:
居中的图片:
居中并且带尺寸的图片:
当然,我们为了让用户更加便捷,我们增加了图片拖拽功能。
如何插入一段漂亮的代码片
去博客设置页面,选择一款你喜欢的代码片高亮样式,下面展示同样高亮的 代码片
.
// An highlighted block
var foo = 'bar';
生成一个适合你的列表
- 项目
- 项目
- 项目
- 项目
- 项目1
- 项目2
- 项目3
- 计划任务
- 完成任务
创建一个表格
一个简单的表格是这么创建的:
项目 | Value |
---|---|
电脑 | $1600 |
手机 | $12 |
导管 | $1 |
设定内容居中、居左、居右
使用:---------:
居中
使用:----------
居左
使用----------:
居右
第一列 | 第二列 | 第三列 |
---|---|---|
第一列文本居中 | 第二列文本居右 | 第三列文本居左 |
SmartyPants
SmartyPants将ASCII标点字符转换为“智能”印刷标点HTML实体。例如:
TYPE | ASCII | HTML |
---|---|---|
Single backticks | 'Isn't this fun?' | ‘Isn’t this fun?’ |
Quotes | "Isn't this fun?" | “Isn’t this fun?” |
Dashes | -- is en-dash, --- is em-dash | – is en-dash, — is em-dash |
创建一个自定义列表
-
Markdown
- Text-to- HTML conversion tool Authors
- John
- Luke
如何创建一个注脚
一个具有注脚的文本。2
注释也是必不可少的
Markdown将文本转换为 HTML。
KaTeX数学公式
您可以使用渲染LaTeX数学表达式 KaTeX:
Gamma公式展示 Γ ( n ) = ( n − 1 ) ! ∀ n ∈ N \Gamma(n) = (n-1)!\quad\forall n\in\mathbb N Γ(n)=(n−1)!∀n∈N 是通过欧拉积分
Γ ( z ) = ∫ 0 ∞ t z − 1 e − t d t . \Gamma(z) = \int_0^\infty t^{z-1}e^{-t}dt\,. Γ(z)=∫0∞tz−1e−tdt.
你可以找到更多关于的信息 LaTeX 数学表达式here.
新的甘特图功能,丰富你的文章
- 关于 甘特图 语法,参考 这儿,
UML 图表
可以使用UML图表进行渲染。 Mermaid. 例如下面产生的一个序列图:
这将产生一个流程图。:
- 关于 Mermaid 语法,参考 这儿,
FLowchart流程图
我们依旧会支持flowchart的流程图:
- 关于 Flowchart流程图 语法,参考 这儿.
导出与导入
导出
如果你想尝试使用此编辑器, 你可以在此篇文章任意编辑。当你完成了一篇文章的写作, 在上方工具栏找到 文章导出 ,生成一个.md文件或者.html文件进行本地保存。
导入
如果你想加载一篇你写过的.md文件,在上方工具栏可以选择导入功能进行对应扩展名的文件导入,
继续你的创作。
注脚的解释 ↩︎