这里主要介绍目前比较主流的一些移动端开发技术方案，以及互相之间的优缺点。
-
技术方案
-
WebApp
-
Native App(原生App)（android、iOS）
-
Hybrid App(混合App)（android+H5）（iOS+H5）
-
react native
-
flutter
-
小程序
-
weex
-
uniapp
-
WebApp
首先来说一下最为熟悉的Webapp，也就是我们常说的h5，说白了就是特定运行在移动端浏览器上的网站应用。通过HTML+CSS+Javascript，从页面架构到样式布局再到逻辑交互。现在最多的是单页面应用SPA（Single-page Application），常见的实现方案为：vue、react、angular；
-
优势
-
可以做到跨平台，调试方便
-
不需要手机安装，不会占用手机的内存，更新速度快
-
不存在多版本问题，维护成本低
-
临时入口，可以做嵌入式
-
开发人员上手速度快
-
-
劣势
-
依赖网络，首次访问加载速度慢，耗费流量
-
受限于手机和浏览器性能，用户体验差
-
功能受限严重，大量移动端的功能无法实现
-
入口强依赖于第三方浏览器，只能以url地址的形式存在，导致了用户的留存率低（优点及缺点)
-
UI同学们可以注意下：
-
移动端UI库
-
Native App
接下来说一下原生开发，自从IOS和Android两个手机的操作系统存在以来，就多了一个新的名词App，意思是运行在智能移动终端设备的第三方应用程序。也叫本地app。一般使用的开发语言为Java、C++、Objective-C。
-
优势
-
相比于其他开发模式，这种模式提供的用户体验最佳，最优质的用户界面，最华丽的交互
-
针对不同的平台提供不同的体验
-
相比webApp，节省带宽成本，打开速度快
-
功能最为强大，特别是跟系统的交互中，几乎所有的功能都能实现
-
IOS独立的优势，AppStore培养了一种比较好的用户付费模式，所以开发者的盈利模式很明朗
-
-
劣势
-
门槛高，原生开发人员人才稀缺，至少比前端和后端少
-
无法做到跨平台开发，开发的成本比较大，各个系统都需要独立开发
-
发布成本高，需要通过store或各个手机的软件审核，导致更新缓慢
-
维护多个版本，多个系统的成本比较高，而且需要做到兼容
-
应用市场逐渐饱和，如何去做宣发，抢占用户，需要花费很大的时间和金钱，导致了很多“僵尸”app
-
Hybrid App（混合开发）
混合开发，也就是半原生半Web的开发模式，这种模式主要是通过将web页面嵌入到app中，通过原生的web view提供容器，将web页面在app中展示，原生只需要开发一些跟系统交互相对复杂的页面即可，不需要和系统交互，或者跟系统简单交互的页面，都可以通过web来实现，原生只需要将一些功能当作api暴露给web页面就行，而web的页面又能做到两个系统兼容，大大减少了原生的工作量，也减少了人员和时间成本。
-
优势
-
相对于web开发，不再局限于浏览器的运行环境，同样在web页面也能做到一些跟系统交互的能力
-
web页面可以做到系统之间的兼容，减少了开发的成本
-
减少了原生的人员成本，只需要较少的原生配合就好，大部分的工作量都交给了web开发
-
web页面可以做到热更新，只更改app内web的页面的话可以做到热更新，不需要通过系统的审核
-
调试简单，web页面依旧可以在浏览器中调试
-
-
劣势
-
比较考验原生的web View的解析渲染效率，因为web View相当于在app内嵌入了一个浏览器的渲染引擎，然后渲染web页面，举一个之前遇到的一种情况：由于大部分页面都是由web来实现的，导致了web项目比较庞大，原生为了避免由于缓存的问题导致页面加载的数据展示问题，就每次都会把缓存清除，这样就导致了，从原生页面首次进入web页面的时候会有加载缓慢，白屏的情况出现。解决方案：1.优化web项目的架构，尽可能的减轻web想的首屏加载的文件体积大小，减少加载时间。2.原生的缓存机制的优化。
-
即懂原生，又懂web的人才比较难找，所以基本是需要原生和web两部分的人员
-
相比原生，对于网络的要求比较高
-
==============================
react native
起初Facebook发现混合开发存在很多缺陷和不足，于是发起开源的一套新的App开发方案RN（reactNative）。使用JSX语言写原生界面，js通过JSBridge调用原生API渲染UI交互通信。
-
优势
-
对于混合开发来说，他的优势在于页面的UI不是用的web端的dom在webView组件中渲染的，而是通过JSBridge渲染的原生的UI，由虚拟dom来驱动页面的view层渲染
-
不需要原生开发人员去做api暴露的工作了,减少了人员的成本代价，而且用的是react语法，对于前端来说更加友好容易上手
-
对于webapp来说，可以做到很多跟系统之间的交互
-
因为JSBridge作为中间层，不仅做了调用系统api的内容，而且，还会将页面的UI做相应的编译，达到一套代码可以多平台发布，做到了多平台兼容，降低了开发成本
-
针对app开发最大的优势在这里，那就是它可以绕过软件商店的审核机制，做到线上热更新
-
成熟度来说
-
2013 年夏季，Facebook 黑客马拉松 – React Native 作为 Facebook 内部项目开始
-
2015 年 1 月，React.js 会议– React Native 1 发布
-
2015 年 3 月，F8 大会 – React Native 正式启动
-
Facebook 宣布 React Native 为 “开放使用并在 Github 上可用”
-
-
-
-
劣势
-
只是接近原生而已，上面也提到了，rn是通过JSBridge作为中间层渲染的原生界面，通过虚拟dom来驱动的，所以用户体验和性能跟原生开发还是有一些差别的
-
应用程序的包体积，Android默认是不支持运行javascript代码的，所以也就意味着，使用rn开发的应用程序需要包含一个支持javascript代码的库。那就导致了它开发出来的应用程序要比普通的原生产品体积大。不过还在rn团队正在减小应用程序的体积大小
-
应用组件和原生组件看起来一样，在任何操作系统更新之后，你的应用程序组件也会升级，可能会破坏应用的用户界面
-
那些应用在用rn技术呢：https://reactnative.dev/showcase
Flutter
Flutter 是 Google 的 UI 工具包，用于从单个代码库为移动、web、桌面和嵌入式设备构建漂亮的、本机编译的应用程序，也就是所谓的一套代码运行在多端，它使用了语言作为编程语言。之前的flutter在开发桌面应用程序的api还处于开发阶段，然而在前端时间更新的flutter2.0中，相同的代码库已经支持将本机应用程序发布到五个操作系统： iOS，Android，Windows，macOS 和 Linux。
-
特点
-
它基于 ——一种快速的，面向对象的编程语言。
-
免费且开源
-
该架构基于非常流行的反应式编程（它遵循与 React 相同的风格）
-
它提供了自己的控件，这些控件是从自己的高性能渲染引擎中提取的，这些控件快速，有吸引力且可自定义
-
-
优势
-
他有热重载，所谓的热重载就是指，开发人员，随时修改自己本地代码库，代码库会实时运行到调试的应用程序中
-
当然flutter和rn一样同样是一个跨平台的框架一次编写，多端运行
-
flutter不依赖原生系统组件，相反flutter拥有自己的一组自定义的组件（widgets）
-
一样的UI，在不同的机型上，样式依旧可以做到相同，更rn不同，rn 是依赖的原生组件，所以有可能不同的机型上， 会有差别
-
-
劣势
-
Dart语言对于前端工程师的学习代价要很大，而且flutter他作为一个，多端使用的框架， 那学习的代价其实挺大的，他有自己的独特的语法，有自己的UI库，而且dart并没有前端的javascript那么的广泛使用。
-
因为他的成熟度跟rn比起来还是比较低的，尽管flutter是开源的，且有很多的库支持，但他毕竟相对来说是一个比较新的事物，可能会在使用中，无法在现有的库中找到满足需求的功能，因此只能开发人员自己去实现，这需要时间
-
同样，作为一个混合开发的应用框架， 他的体积大小肯定也是比原生的要大，毕竟他不只做这一件事
-
成熟性flutter从18年二月发展到现在，虽然很受人欢迎，但是他的稳定以及各个方面的工作，都需要时间来获得更多的优化，但是值得注意的是，gitHab上，flutter有12.2W stars, RN有9.6W
-
注意：本文归作者所有，未经作者允许，不得转载
