如何区分手机端 APP 是原生 APP 还是 H5？H5 和原生 APP 之间的区别

**

如何区分手机端 APP 是原生 APP 还是 H5？

**

1.如果断开网络，立即显示 404 或者页面错误基本上是 H5

2.通过查看页面布局边界，操作步骤 a.手机设置，开发者选项里去开启，打开页面布局开关，b.然后进入 APP 里查看布局边界即可。(APP 能看到各个控件边界，H5 整体页面布局边界)个人觉得比较好用

3.如果长按页面出现放大镜、复制、粘贴等功能、或者手机震动等情况，基本确定是 H5

4.如果打开一个新页面， 在导航栏下有一条，显示进度加载线，这个页面基本上就是 H5

5.如果 APP 的导航栏，上面会出现关闭的按钮，当前页面也基本上是一个 H5 页面

6.如果下拉页面，出现网址提示框，也可以确定是 H5

H5 和原生 APP 之间的区别

https://zhidao.baidu.com/question/652645496454662165.html

原生 APP 访问和兼容的能力也比较好，可以支持在线或者离线消息推送或是进行本地资源访问，以及摄像、拨号、蓝牙、功能的调取。原生 APP 开发有许多的优势，如原生 APP 是针对不同的平台为用户提供不同的体验、节约宽带成本、访问本地资源速度更快，并为用户提供最佳的用户体验和优质的用户界面等。

Web App 是一种框架型 APP 开发模式(HTML5 APP 框架开发模式)，具有跨平台的优势，该模式通常由“HTML5 云网站 +APP 应用客户端”两部分构成，APP 应用客户端只需安装应用的框架部分，而应用的数据则是每次打开 APP 的时候，去云端取数据呈现给手机用户。
我们现在手机中的 APP，大部分都是混合 APP，也就是既用到了原生 APP 的技术，又用到了 Web APP 的技术，各自混合的比例从 0% 到 100% 之间不等。更好的了解 APP 的类型，有助于我们选择合适的测试策略。今天就从 4 个方面来了解下原生 APP 和 Web APP 的区别。

开发方面有区别：
(1)原生 APP：Native APP， 每一种移动操作系统都需要独立的开发项目，iOS 版本、iPad 版本、Android 版本。每种平台都需要独立的开发语言 Java(Android)，Objective-C(iOS)等等，需要使用官方给出的软件开发包，开发工具等。
(2)原生 APP 开发成本高、开发速度慢、维护成本高。不同平台的规则、推广、运营都不相同。官方应用市场对 APP 上线审核流程比较复杂且耗时很长，严重影响 APP 的发布上线的速率。
(3)Web App ：因为运行在移动设备的浏览器上，所以只需要一个开发项目。可以通过 HTML、CSS 或者 JavaScript 来进行 Web APP 的开发。开发成本低、开发速度快。
功能有区别：
(1)原生 App：一个系统性的应用程序，可以类比于电脑上的软件。原生 app 可以调用移动终端的硬件设备，比如：麦克风、摄像头、短信、蓝牙、GPS 等。实现功能丰富
(2)Web App：可以类比于电脑上的网页。更多是页面展示类的 APP。只能使用有限的移动硬件设备功能，侧重于简单的交互，无法使用很多硬件设备独特的功能。
版本控制有区别：
(1)原生 App：用户可以自由地选择是否更新软件版本，所以会出现不同用户同时使用不同版本的情况。同时也会导致维护成本比较高。使用旧版本的用户无法体验新版本的完整功能。
(2)Web App：所有的用户都是用同样的版本，所有用户获得的功能都是相同的。版本更新比较方便，直接在服务器侧更新数据即可。一个功能做好了就能上线，一天更新几十次都毫无压力。如果客户端只是个浏览器，那一切都会变得很简单。
对于网络的需求不同：
(1)原生 App：断开网络，可以继续使用已缓存在本地的数据，大部分功能不受影响。
(2)Web APP：断开网络，绝大部分功能不能使用，受到很大影响。
小结
原生 App 偏向于交互，注重用户体验(导航切换、勾选选项、图片、视频等操作)。Web APP 偏向与浏览和简单的交互，一些功能需要访问硬件(摄像头、传感器等)，使用原生 App, Web APP 用于展示信息。成本有限时，核心的功能使用原生 APP，辅助的功能使用 Web App。
目前比较流行的方法就是将原生 App 和 Web App 进行融合，就是说应用大的框架是原生的，其他详细的内容就通过网页封装，也就是前文提到的混合 APP。这样做的好处就是在方便更新的同时，也能保证核心功能的交互体验
再看下这个应该能得到更多的信息

*https://zhuanlan.zhihu.com/p/84858741

*H5 APP 即是一种框架型 APP 开发模式(HTML5 APP 框架开发模式)，该开发具有跨平台的优势，该模式通常由“HTML5 云网站 +APP 应用客户端”两部份构成，APP 应用客户端只需安装应用的框架部份，而应用的数据则是每次打开 APP 的时候，去云端取数据呈现给手机用户。

原生 APP 又称 Native App，该开发针对 iOS、Android、Windows 等不同的手机操作系统要采用不同的语言和框架进行开发，该模式通常是由“云服务器数据 +APP 应用客户端”两部份构成，APP 应用所有的 UI 元素、数据内容、逻辑框架均安装在手机终端上。

开发方面的区别（这个地方太专业啦，请教了团队的开发小伙伴）
目前 React Native 开发越来越火，微信小程序是基于 React Native 开发的，体验接近原生 APP，发展前景值得重视。不过好在现在非原生 APP 同样可以调用蓝牙、相机等硬件，也能顺利发布到苹果 APP store。

移动 Web App

因为运行在移动设备的浏览器上，所以只需要一个开发项目
这种应用可以使用 HTML5,CSS3 以及 JavaScript 以及服务器端语言来完成(PHP,Ruby on Rails,Python)
这里可没有标准的 SDK，基本任意选择别忘了有一些跨平台的开发工具，比如 PhoneGap, Sencha Touch 2 以及 Appcelerator Titanium 等等。
原生 App

每一种移动操作系统都需要独立的开发项目
每种平台都需要独立的开发语言。Java(Android), Objective-C(iOS)以及 Visual C++(Windows phone)等等
需要使用各自的软件开发包，开发工具以及各自的控件
能力方面的区别
移动 Web App

只能使用有限的移动硬件设备功能。

原生 App

能够与移动硬件设备的底层功能，比如个人信息，摄像头以及重力加速器等等。对于这一点感触很深刻，2016 年做新年 H5 营销小活动的时候，就是因为没有考虑到 H5 不能使用移动硬件端重力加速器而导致临时替换设计方案。

获取方法的区别
移动 Web App

从移动设备上的浏览器访问
不需要安装额外的软件
软件更新只需要服务器就够了
因为现在没有什么商品或卖场提供这种 App，不过一般都是嵌套在系统内部，或者内部系 统中使用
跨平台开发，用户不需要去卖场来下载安装 App
需要过度依赖网络，没有任何缓存数据
任何时候都可以发布 App，因为根本不需要官方卖场的审核
如果你已经有了一个 Web App，你可以使用 responsive Web design 来辅助改进(这也是优势？)
所有的用户都是用同样的版本
原生 App

直接下载到设备
以独立的应用程序运行(并不需要浏览器)
用户必须手动去下载并安装这些原生 App
有一些商店与卖场来帮助用户寻找你的 App，app store 里面应有尽有。
原生型 APP 应用的安装包相对较大，包含 UI 元素、数据内容、逻辑框架;
手机用户无法上网也可访问 APP 应用中以前下载的数据。
原生型的 APP 可以调用手机终端的硬件设备(语*音、摄像头、短信、GPS、蓝牙、重力感应等)
APP 应用更新新功能，涉及到每次要向各个应用商店进行提交审核。
用户可以自由地选择是否更新软件版本，所以会出现不同用户同时使用不同版本的情况
即使两者之间有很大的区别，即使 H5 有一大堆的坑和问题，但是仍旧不妨碍移动 Web 无所不在，移动 Web 是目前唯一的支持各种设备访问的平台，也是唯一一个可供开发者发布移动应用的平台，它将各种移动交互与 PC 系统任务有效的结合在一起。而原生 native app 可以充分利用设备的特性，这一点是它得天独厚的优势。

正式因为它有复杂多变的 CSS 样式消耗了大量性能，它才有一个更有竞争力的优势——它带来了多样性的排版，能够细致到每一个字宽行高和风格的像素级处理，能够给你带来不一样的图文汇合的排版

作者：zzhangsiwei
链接：http://testingpai.com/article/1616134465491
来源：测试派
协议：CC BY-SA 4.0 https://creativecommons.org/licenses/by-sa/4.0/