简单的跨平台对比


越来越多公司选择跨平台APP，在简单了解前提下做个对比，现在选择大致有FLutter，RN，Weex，uni-app

选择跨平台我个人考虑的地方有原生交互的方便程度，打包方便程度，框架难度(这个可能相对次要)。

原生交互

按现有业务情况 有些功能跨平台并不可能100%实现，比如第三方登陆 苹果要求一定要加上苹果登陆，比如内购等等。。。

  • uni-app
    uni-app 的调用原生简直就是灾难片，文档意思是将原生对象映射为JS，通过JS调用，前提就是你要同时对JS iOS 安卓 都有一定理解，虽然提供了一定模板，基本上只有安卓的。


    然后uni-app的如果需要混编，按文档大概意思是将代码封装成原生SDK，在原生中替换webview，在webview 中用JS做交互。。。这个方案听的怎么这么熟悉呢？

    截屏2019-11-14上午10.46.04.png

  • Flutter
    相对而言比较友好，原生->CHANNE->Dart或者Dart-> CHANNEL->原生 都非常方便
    Flutter 的集成方案在GitHub上也很多，除了Flutter环境配置因为有墙的存在比较麻烦，其他都很方便。比如iOS方面想最简单集成只需要生成一个 flutter项目 放在同一级目录下，然后修改podfile，执行 pod基本就可以了，原生代码只需要极少的修改，安卓的迁移也十分简单

  • RN
    一个老牌跨平台方案，一直说要重构遥遥无期。
    RN传值调用也是非常简单，iOS和安卓 通过一个Module类就可以实现，RN的文章和库应该是最多的，随便搜下就明白了
    RN的集成和原生页面跳转也和flutter 区别不大，都是非常容易实现

  • Weex
    不熟悉不了解,极少更新，使用的公司少，应该不在大多数人技术选型范围内

打包
  • uni-app
    如果使用收费插件就只能云打包，云打包如果有支付功能 iOS有一定概率被拒。没有收费插件可以本地打包，但是过程比较繁琐，各种依赖库的添加删除，并且打包体积相较于云打包会明显更大
  • Flutter
    Flutter内部集成有指令可以直接打包，或者使用idea 打包，基本与原先一样
  • RN
    iOS稍微比flutter打包麻烦，需要把资源文件打包拖进项目内用Xcode打包。安卓保持原先idea打包方式，或者生成APK后重签
项目结构和选取部分UI部分代码
  • uni-app
    始终排的不整齐 截图代替

    截屏2019-11-14下午3.16.51.png

截屏2019-11-14下午2.49.59.png

截屏2019-11-14下午2.50.03.png

截屏2019-11-14下午2.46.39.png

  • Flutter
    ┌─android android项目目录
    ├─assets 资源目录
    ├─build 打包目录
    ├─iOS iOS项目目录
    ├─lib 代码存放
    ├─test 测试文件
    └─pubspec.yaml 项目配置文件，比如资源 依赖等等


    截屏2019-11-14下午3.02.25.png

  • RN
    ┌─android android项目目录
    ├─ ios 资源目录
    ├─ node_modules 基于node文件依赖存放
    ├─ index.android.js Android入口文件
    ├─ index.ios.js iOS入口文件
    └─ JS 存放JS文件


    截屏2019-11-14下午3.13.20.png

引用别人的几张对比图


截屏2019-11-14上午11.56.30.png

截屏2019-11-14上午11.56.47.png

附上几个链接

  • uni-app
    Hello uni-app
    hello-uniapp 源码地址

    新闻资讯 iOS 安卓

  • RN
    GitHubPopular iOS
    GitHubPopular 安卓
    GitHubPopular 源码地址

    surmon.me.native 安卓
    surmon.me.native 源码地址

  • Flutter
    flutter-go 安卓
    flutter-go iOS 版本App Store直接搜索
    flutter-go 源码地址

    FlutterOSC 安卓
    FlutterOSC 源码地址