H5页面和移动App

HBuilder

https://www.youtube.com/watch?v=QIaYqtR_LxU

https://www.youtube.com/watch?v=V48qFKCSkMQ

优点

原生 App 的优点主要是两个：（1）较好的性能和体验；（2）可以使用系统的所有硬件和软件 API，比如 GPS、摄像头、麦克风、加速计、通知推送等等，能充分发挥系统的潜力。

混合 App 的前端就是 HTML5 网页，所以简称 H5。这个词是国内独有的，基本上都是前端程序员在用，国外不用这个词，就直接叫混合 App。

缺点

原生 App 必须下载安装才能使用，只要升级版本，就必须重新下载安装。用户往往不愿意更新版本，厂商被迫不得不长期支持很久以前的旧版本。

Web App 的主要缺点有两个。首先，浏览器提供的 API（即 Web API）很有限（目前只有相机、GPS、电池等少数几个），大部分系统硬件都不能通过网页访问，也无法直接读取硬盘文件，所以 Web App 无法充分利用平台的硬件。

第二个缺点是，网页通过浏览器渲染，性能不如原生 App，不适合做性能要求较高的页面。

不能从手机的首屏直接进入。

缺乏手机状态栏和锁屏时的通知推送能力。

不支持脱机访问（即断网也能使用）。

混合 App 的主要缺点是，由于存在网页引擎的中间层，所以性能比较欠缺，不仅不如原生 App，而且由于 WebView 不是全功能浏览器，可能比 Web App 都要慢一些。

Web App 是使用网页做的应用程序，必须在浏览器中使用。比如，你在浏览器中收发邮件，就是在使用 Web App。

Web App 主要使用网页技术，即 HTML、JavaScript 和 CSS。2008年，w3c 组织发布了 HTML 第5版，简称 HTML 5，该版本大大增强了网页的功能，使得网页可以当作应用程序使用，而不仅仅是展示文字和图片，这就是 Web App 的由来。

混合App

混合 App 的原生外壳称为"容器"，内部隐藏的浏览器，通常使用系统提供的网页渲染控件（即 WebView 控件），也可以自己内置一个浏览器内核。结构上，混合 App 从上到下分成三层：HTML5网页层、网页引擎层（本质上是一个隔离的浏览器实例）、容器层。

混合 App 里面的网页不同于普通网页，可以调用底层系统所有的 API。奥秘就在于外层容器提供了 API Bridge，充当底层 API 的中介，允许内部的网页调用底层。

所谓 API Bridge 就是容器在底层接口和网页之间，建立一座桥梁，让双方通信。容器一旦接到网页的请求，就根据请求去调用底层系统的 API，然后再返回结果给网页。API Bridge 往往以 JavaScript 语言提供，方便网页调用，这时又称为 JSbridge。

小程序

小程序，可以看作是针对特定容器的 H5 开发。微信本身是一个容器，开放自己的接口（JSbridge），外部开发者使用规定的语法，编写页面，容器可以动态加载这些页面

转载https://cloud.tencent.com/developer/article/1579224?from=information.detail.%E5%9C%A8%E7%BA%BF%E5%B0%86h5%E8%BD%AC%E6%88%90app

Chrome 团队开发了新技术"渐进式 Web App"（Progressive Web App，缩写 PWA）