Uni-App是一家公司(DCloud)产品,公司承诺将一直开源且免费。
公司旗下有4个产品:
HBuilder X:开发工具
uni-app:跨平台统一框架
uniCloud:云服务提供商
uniMPsdk:Mobile端sdk,用于接入uni-app开发的模块
主要盈利方式是uni-ad(广告业务)和unicloud(云服务商)
个人觉得最核心的优势是,uni-app适合小公司,在只有前端开发人员的情况下,很方便地调用原生的功能,并且还能同时在微信小程序以及App商城上架App,大大降低了App开发的门槛,加快了业务开发和扩展速度。里写自定义目录标题)
html+css+JavaScript+vue+uni-app自定义标签
uni-app项目要求使用vue格式组织编码文件格式(跟微信小程序的语法也很类似,因为都是参照的vue格式),但是html标签不再完全是原始的html标签。譬如div->view,span->text等等。意味着,如果一个项目使用了uni-app开发,那么后续是没法再转换为VUE项目或者小程序项目了。
基本语言和开发规范
uni-app代码编写,基本语言包括js、vue、css。以及ts、scss等css预编译器。
在app端,还支持原生渲染的nvue,以及可以编译为kotlin和swift的uts。
DCloud还提供了使用js编写服务器代码的uniCloud云引擎。所以只需掌握js,你可以开发web、Android、iOS、各家小程序以及服务器等全栈应用。
为了实现多端兼容,综合考虑编译速度、运行性能等因素,uni-app 约定了如下开发规范:
uni-app分编译器和运行时(runtime)。uni-app能实现一套代码、多端运行,是通过这2部分配合完成的。
编译器将开发者的代码进行编译,编译的输出物由各个终端的runtime进行解析,每个平台(Web、Android App、iOS App、各家小程序)都有各自的runtime。
编译器
编译器支持条件编译,即可以指定某部分代码只编译到特定的终端平台。从而将公用和个性化融合在一个工程中。
运行时(runtime)
runtime不是运行在电脑开发环境,而是运行在真正的终端上。
uni-app在每个平台(Web、Android App、iOS App、各家小程序)都有各自的runtime。这是一个比较庞大的工程。
在小程序端,uni-app的runtime,主要是一个小程序版的vue runtime,页面路由、组件、api等方面基本都是转义。
在web端,uni-app的runtime相比普通的vue项目,多了一套ui库、页面路由框架、和uni对象(即常见API封装)
在App端,uni-app的runtime更复杂,可以先简单理解为DCloud也有一套小程序引擎,打包app时将开发者的代码和DCloud的小程序打包成了apk或ipa。当然,事实上DCloud确实有小程序引擎产品,供原生应用实现小程序化,详见
uni-app runtime包括3部分:基础框架、组件、API。
DCloud还提供了插件市场,大多数用得着的组件和API都已经有现成的插件。
逻辑层和渲染层分离
在web平台,逻辑层(js)和渲染层(html、css),都运行在统一的webview里。
但在小程序和app端,逻辑层和渲染层被分离了。
分离的核心原因是性能。过去很多开发者吐槽基于webview的app性能不佳,很大原因是js运算和界面渲染抢资源导致的卡顿。
不管小程序还是app,逻辑层都独立为了单独的js引擎,渲染层仍然是webview(app上也支持纯原生渲染)。
所以注意小程序和app的逻辑层都不支持浏览器专用的window、dom等API。app只能在渲染层操作window、dom,即renderjs。
关于逻辑层和渲染层分离带来的注意事项,请详读
对比H5版本和小程序版本效果。
H5版本
可在PC和移动端浏览器打开,可在App的WebView中开发
输出格式 | PC浏览器 | android浏览器 | iPhone浏览器 | android App中的WebView |
---|---|---|---|---|
H5 | ✅ | ✅ | ✅ | ✅ |
Uni小程序版本
接入Uni-app的小程序sdk,将前端输出为uni-app小程序,在App中小程序的方式运行。
接入结果:接入成功,可正常运行。与H5版本对比,流畅度区别不大。(只在android端做了验证)
启动时间&App包体积:
输出格式 | 冷启动时长 | 包体积(arm64-v8a debug) | 内存占用 | 打开小程序页面耗时 |
---|---|---|---|---|
未接入Uni-app小程序sdk | 488ms | 11.6m | 52M | NA |
接入Uni-app小程序sdk | 670ms | 23.3m | 48M+114M+61M(多进程) | 327ms |
启动时间测量方式:
通过脚本自动化启动/关闭Demo App首页Activity,提取logcat中的Displayed时间作为启动时间,采样20次取平均值。
主要命令如下:
startupcommand = 'adb shell am start -n com.youdao.uni_apptestdemo/.MainActivity'
obtainLogCommand = 'adb logcat | grep "Displayed" > tmp.txt'
stopCommand = 'adb shell am force-stop com.youdao.uni_apptestdemo'
proc=subprocess.Popen(obtainLogCommand,shell=True)
for i in range(20):
os.system(startupcommand)
time.sleep(2)
os.system(stopCommand)
time.sleep(10)
proc.terminate()
Demo下载:
https://github.com/dongzhixuanyuan/file_server_tool/blob/master/uni-app.apk
说明:
开发体验不错,HBuilderX IDE功能完善,自动化程度高,代码提示、代码补全、代码跳转均支持,代码运行、预览、调试方便,多平台模拟器及工具衔接完善
App功能配置,原生功能支持丰富,并且可在IDE中一键集成,非常方便
社区生态比较庞大,在调研接入的过程中,配到的问题都能得到及时解决
uni-app有广告接入服务,其对接了目前市场上的一些主流广告商,使用uni-app开发的app基本不能自由接入其他的广告平台,有一些因为接入第三方广告平台而导致App功能无法使用的案例。官方表述如下