本文主旨是解释App开发的历史进程，各种混合模式的区别和优缺点。App开发大致分为两种模式，原生模式 和 混合模式。对比最适合前端开发工程师使用的App开发模式。

1. 原生开发

• Android: java | Koltin
• iOS: Object-C | Swift
• Windows: C
• HarmonyOS: ArkTs / JS

2. 混合开发

1. Flutter: 最接近与原生开发模式，使用 Dart 语言开发。针对于前端来讲学习成本较高。
2. React-natvie: 使用React前端框架开发，实现效果也比较接近原生开发。对于熟练使用 React开发的程序员来讲学习成本不高。
3. webview: 使用 webview+jsbridge 技术实现app开发。实现效果一般。对于 Vue 或 React 开发人员都有学习成功极低的开发方式。比如 uni-app、taro 等。

3. React-native

• 当前最新版本是 0.74 (2024/07/26)。
• React-native的发展历程。

  1. WebView：由 Native 提供 Webview 容器，业务用 Web 技术来开发。与下面 webview 差不多的原理。

  2. Porting React to native：把 React 移植到 Native 实现。放弃了webview渲染器，采用原生自带的UI组件代替了核心的渲染引擎，性能大幅提升。但是与原生交互依然采用 JSBridge 的方式，依然收到 JSBridge 的限制。同时期的 Weex(阿里巴巴+Vue生态) 也是用了这种类似的方案！

     React-old.png

  3. Scripting native：通过 JavaScript 调用 Native API。完美避开了 JSBridge 的限制， 使用全新的 Fabric(UI Manager 新架构) + Yoga Tree节点、Turbo modules(与原生Natvie交互)的模式进行开发 。应该是在 v0.6+ 后使用该模式！
     react-new.png

4. React-native + expo

• 现在 react-native 版本是 0.74(2024/07/26)，官方文档在推荐使用 expo 的方式进行项目的构建和开发。
• 在 best of js 网站上，移动端开发 react-natvie 和 expo 已经霸榜很久了。
• expo: 构建一个在所有用户设备上原生运行的 JavaScript/TypeScript 项目。Expo 应用是 React Native 应用，因此所有 Expo SDK 包都可以在安装并配置了 expo 包的任何 React Native 应用中工作。
• Expo功能简介：官方文档 中文文档
  • Expo SDK: 以包的形式提供对设备和系统功能的访问，例如联系人、相机、陀螺仪、GPS 位置等。
  • Develop an app with Expo: 概述构建 Expo 应用程序的开发过程，以帮助构建核心开发循环的心智模型。
  • Expo Modules Api: 使用现代 Swift 和 Kotlin APl编写高性能的原生代码。
  • Prebuild: 将 React 与 Native 分开，可以从任何计算机进行开发，轻松升级，为应用程序贴上白标签，并维护更大的项目.
  • Expo CLI: 管理依赖项、编译原生应用程序、进行 Web 开发，并连接到具有强大开发服务器的任何设备。
  • Expo Go: 通过在模拟器或设备上尝试来学习 React。

5. webview

• webview 也可以理解为 hybrid 混合模式，两个阶段的发展历程。

  1. 在 iOS/Android 上嵌入一个浏览器，在浏览器上运行 前端代码， 渲染在webview视图上。 近似于使用 chrome 或者 safari 浏览器默认输入了网络地址直接进行渲染的模式。
     hybrid-old.png

  2. 在上面阶段的基础上使用 JSBridge 能够调用了 natvie 的一些功能了。

     Hybrid-new.png

• 目前社区比较活跃的也比较常用的开源的框架

  • uni-app: vue
  • taro: react
  • 用友(apicloud)： html(也可兼容vue或者react)
  • PhoneGap/Cordova: angular
  • 微信小程序