原生应用，混合应用，H5应用区别

左手的ㄟ右手 2022-04-22 07:06 315阅读 0赞

近几天一直在学习混合应用的开发。先前对于原生，混合，H5应用有些分不清，通过这篇文章可以让自己理清一下思路，对于这三个概念的理解更加系统。

## 一：原生开发（Native App） ##

早在几年前移动互联网的浪潮已经席卷而来，那时候学习IOS和Android开发的学生非常多，来看一下原生应用。  
**概念：**  
原生app之所以称之为原生是因为他在开发时是由移动设备厂商自身提供的SDK或建议的开发方式来进行开发的；通常有android和ios两类开发方式，他们分别是基于Java语言和C++语言的，因此使用原生开发每一类app所需要的语言也不太一样。  
**优点：**  
1：原生app因为采用的是由各移动厂商提供的SDK，是基于特定的移动设备的操作系统所设计出来的，因此它的针对性强，与用户的交互体验非常好，性能很稳定；  
2：更加贴近底层，因此他的操作更加的流畅；  
3：相比较于混合应用，他在转场时的效果更加出色，不会出现各种白屏等现象，这也就会增加客户的留存率；  
4：在应用中涉及到调取手机的相机等硬件设备，这些操作都是web APP实现不了的；  
5：网络上，webapp一旦断网就无法访问，但是在原生app中即使断网也可以访问原来下载好的数据；  
**缺点：**  
1：同一个项目，针对不同的手机操作系统都要进行独立的开发，比如android和ios，同一种软件，要为不同的操作系统开发两个针对性项目。这就造成了开发成本的急剧上升，因此有一个段子就调侃道：“有钱有流量有资源，做App；穷逼做H5-\_-”。  
2：测试的时候也是非常麻烦，每一次修改都需要重新测试一次，而且上架时需要等待官方审核通过。  
3：成本高，更新缓慢，这些成为了原生app逐渐被替代的主要原因。  
（但是就算在混合开发中，很多框架都达不到原生的效果，单论性能来讲，原生是最佳的）。

## 二：H5开发（Web App） ##

**概念：**  
H5开发时使用html，css，JavaScript开发的一个展示型应用，主要用于浏览器中进行点击后展示一些信息，他不能够调用手机底层的设备，比如说：手机版的小米官网，手机版的苹果官网。  
具体的表现是在手机浏览器中会有一些应用的小图标，这些小图标在点击后，在浏览器中加载页面和你下载的app后打开页面是相同的，而这些小图标代表的就是web app。

**优点：**  
1：方便测试，只需要输入网址就可以进行测试；  
2：想要新增功能直接在后台添加即可，不需要通知用户升级；  
3：量级低，开发成本很低，而且相应的他也不需要安装包；  
4：是基于浏览器的，可以跨平台使用；  
**缺点：**  
1：断网就歇菜；  
2：功能单一，用于展示，无法调用底层功能，比如相机；  
3：与原生应用相对，他的交互体验很差；

## 三：混合开发（Hybrid App）： ##

混和式App结合了原生App的支持度与Web App网页设计的技术，使用web app的技术进行开发，再封装成类似原生一样的app。  
**优点：**  
混合应用的出现就是集两者之优点，在开发上比原生更加简便，在功能上更加贴近原生全面超越web app。  
**缺点：**  
最主要的缺陷就是在性能上还是不如原生更加稳定，不如原生的交互体验更好。  
**三套开发组合：**  
1： Angular/AngularJS + OnsenUI + Cordova  
2： Vue + MUI + H5+  
3： HUI + React + ReactNactive

**最后的话：**  
只是看到了冰山一角，还在努力前行。如有错误，请一定要提醒，万分感谢。