app端前端框架对比 - Mui与ionic、Cordova 、Weex、React Native对比

1.1.1.介绍: mui是最接近原生App体验的前端框架。

极小:100k的js文件,60k的css文件。原生编写,不依赖任何三方框架

极强:xcode和Android studio里所有原生控件都具备

高性能:精练的代码、适时的5+原生动画调用,达到原生应用的体验

多端发布:编写一套代码,iOS、Android、浏览器、微信App、百度直达号、流应用全覆盖

1.1.2.Mui能力? HTML5plus Runtime,常用包括二维码、摇一摇、语音输入、地图、支付、分享、文件系统、通讯录等常用API,封装成跨平台的HTML5plus规范。 其他原生API – Native.js,调取原生功能 更多原生SDK引入 – 5+ Runtime SDK,比如身份证扫描SDK,把5+ runtime作为一个SDK放入到其他原生App中,用5+ SDK替代webview,和原生层交互通信。(这块类似cordova的设计) 体验:

开发&体验?
体验样式地址:http://dev.dcloud.net.cn/mui/ui/#dialog MUI HTML5前端框架,轻巧、漂亮、开源 HBuilder HTML5 IDE 编程,要爽 wap2app M站快速转换成App,原生般体验 UniApp 完美的跨平台App,兼容小程序快应用 5+Runtime HTML5强化引擎,能力、性能接近原生 流应用

开发IDE: HBuilder HBuilderX

1.1.3.更新&维护? 5+应用可使用以下方式进行升级 整包升级:适用于大版本更新,runtime发生变化时(模块、配置、版本等变化)必须使用此更新方法 应用资源升级:适用于小版本更新 。runtime不变,前端页面整体压缩包更新 应用资源差量升级:适用于小版本更新 。runtime不变,前端页面仅需要更新的部分更新。

2.其他框架: ReactNative 、 Cordova 、Ionic、weex

2.1.1.React Native 如果从成熟度来看,react native 是不二选择。但是,需要维护两套代码,即 iOS,Android 各一套。并且开发调试 iOS 只能使用 Mac 设备。

优势: 文档全 社区成熟 组件丰富

劣势: 需要维护两套代码,团队没有 React 经验对开发设备有要求,调试不方便

2.1.2.Weex 而 weex 可以做到 iOS, android, H5 共用一套代码,但是,这个是国内阿里维护的项目,靠谱度存疑,遇到问题估计很难查到资料。而且我们需要使用蓝牙访问硬件设备,而 weex 并没有现成的组件实现,需要我们自己用 native 来实现。

优势: 三端共用一套代码,调试简单,团队都有 Vuejs 实战经验

劣势 : 国内开源项目不太靠谱、社区极度不成熟、文档不全、组件有限、且下载量都在两三百的量,质量无法保证、需要 native 代码扩展蓝牙数据读取;

2.1.3. Cordova、ionic 这个虽然比较成熟,所有UI组件都是有html模拟,可以统一使用,
但是唯一的问题:是大家普遍反映体验不够流畅。

优势: 文档全、社区成熟、组件丰富、

劣势: angularjs、不太靠谱、流畅度存疑

  • 0
    点赞
  • 2
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
1 简介 1、Native APP(原生) 2、Hybrid APP(混合) 3、React Native Hybrid App按网页语言与程序语言的混合,通常分为三种类型:多View混合型,单View混合型,Web主体型。 2 技术 2.1 技术选型 Ionic 2.1.1 Ionic介绍 Ionic是一款基于Angular、Cordova的强大的HTML5移动应用开发框架,可以快速创建一个跨平台的移动医用。可以快速开发移动APP、移动WEB页面、微信公众平台应用,混合APP WEB页面。 2.1.2 Ioniccordova、Angular关系 Ionic = cordova + Angular + ionic Css Ionic 是完全基于谷歌的 Angular 框架,在 Angular 基础上面做了一些封装,让我们可以更快速和容易的开发移动的项目。Ionic 调用原生的功能是基于 Cordova,Cordova 提供了使用JavaScript 调用 Native 功能,ionic 自己也封装了一套漂亮的 CSS UI 库。 2.1.3 开发工具 Visual Studio Code 2.1.4 管理工具 Git 2.2 环境搭建 2.2.1 概述 2.2.2 JDK 2.2.2.1 版本 jdk1.8 2.2.2.2 配置 JAVA_HOME PATH CLASSPATH 2.2.3 Apache ant 2.2.3.1 版本 1.9.12 2.2.3.2 解压 2.2.3.3 配置 ANT_HOME: D:\android\apache-ant-1.10.4 Path: %ANT_HOME%\bin 2.2.3.4 查看安装版本 ant –v 2.2.4 android SDK 2.2.4.1 版本 r24.4.1 2.2.4.2 配置 ANDROID_SDK_HOME: D:\Android\android-sdk-windows Path:%ANDROID_SDK_HOME%\platform-tools;%ANDROID_SDK_HOME%\tools 2.2.4.3 SDK 通过SDK Manager下载相关的版本 2.2.4.4 查看信息 android -h 2.2.5 node.js 2.2.5.1 版本 8.11.3 2.2.5.2 安装 2.2.5.3 查看版本 node –v npm -v 2.2.6 npm/cnpm 2.2.6.1 安装npm nodejs已经集成了npm 2.2.6.2 安装 cnpm npm install -g cnpm --registry=https://registry.npm.taobao.org 2.2.7 cordova 2.2.7.1 版本 8.0.0 2.2.7.2 安装 npm install -g cordova 可以使用cnpm代替npm cnpm install -g cordova ionic 2.2.7.3 查看版本 cordova -v 2.2.8 ionic 2.2.8.1 版本 3.20.0 2.2.8.2 安装 npm install –g ionic 可以使用cnpm代替npm cnpm install -g cordova ionic 2.2.8.3 查看版本 ionic –v 2.2.8.4 查看信息 ionic info 3 项目 3.1 创建 3.1.1 新建 3.1.2 启动 3.1.3 打包 3.1.3.1 添加 3.1.3.2 生产release版apk(签名后安装) 3.1.3.3 生成debug版apk 3.1.4 签名 3.1.4.1 生成签名文件 keytool -genkey -v -keystore testapp.keystore -alias testapp.keystore -keyalg RSA -validity 20000 3.1.4.2 apk签名 jarsigner -verbose -keystore testapp.keystore -signedjar app-release-signed.apk app-release-unsigned.apk testapp.keystore 3.1.5 安装 安卓手机安装使用

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值