hybrid技术

hybrid是什么？hybrid译为中文是“混合”的意思，是一种原生APP和HTML5混合开发的技术。

在前端移动端开发中，到现在阶段主要有三大潮流

1. 原生APP开发(以Android和iOS为主导)
2. HTML5 webAPP开发
3. 原生APP和HTML5混合开发，也就是这里的hybrid技术

今天我们就来聊一聊hybrid技术
首先，为什么要有这个hybrid技术，当然是原生APP开发和web开发暴露出了问题。

• 对于原生APP开发，开发成本高，周期长，维护成本高，并且当今社会处于高速信息发展时期，产品必须快速迭代，而且原生的APP都需要经过应用商店审核才能够上线，那么这对于企业来说，尤其是创业公司来说是不可以接受的，时间代表着金钱。
• 对于以HTML5主导的webAPP开发，优点就是开发成本低，可以快速迭代，但是缺点也是相当明显，每次切换一个页面都要发送一次http(https)请求，从系统架构软件质量属性的性能来说，它是不可接受的，用户体验及其不友好。
• 于是乎，基于原生APP和前端页面的hybrid技术火了起来。

那么hybrid技术是如何工作的呢？

首先，我们必须理解如下三个协议：

1. file协议：用于打开本地文件，特点当然就是速度快。
2. https协议：http+ssl协议，这个协议需要发送一次网络请求，当然相对于file协议就慢的很多了。
3. schema协议：用于客户端和前端通讯的协议。微信部分schema协议如下(大家经常玩的朋友圈里面的链接打开的其实就是网页)：
   

其次，大家还要理解webview的概念。

那么什么是webview呢？其实就是一个用来存放文件的容器，我用下面图片的形式展示给大家：

红色框里的内容就是存放前端内容的容器，而红色框外面的为原生APP的东西。

---

好了，假如我在webview容器里直接通过file协议调用前端页面是不是比用HTML5发送HTTPS协议要快的多了呢。

那么接下来就是客户端如何和前端页面进行交互了，这就是前面的schema协议了。

这时候有的小伙伴可能就会问了，我用的hybrid技术开发的APP一天迭代一百次，怎么让用户同步更新呢？如下图所示：

我们可以用原生APP的API来发送一次网络请求来获取我们服务端页面的内容，这时小伙伴可能会有疑问了，你用HTML5不也是发送一次HTTPS请求吗，这样不也是很慢吗？NoNoNo，大家不要忘记JavaScript是一种解释型的语言，你请求来js文件之后还要解释执行。而你通过原生的APP可以在打开APP的同时就把服务器的页面请求过来然后再去执行本地js文件就OK了。
当然，这里的请求也是有技巧的，不是每一次打开APP都去服务端请求新的东西，只有服务端有新的东西变化时才去请求，这样又可以提高一部分效率了。
实现思路可以参考如下：只有用户版本号和服务器版本号不一致的时候才去请求。

好了，我简单的阐述完了混合APP内部是如何执行的以及原生APP和服务端之间的通信，估计也能够解决大家在打开原生APP发现切换页面的时候会有HTML5页面切换的疑问了。

当然hybrid技术也并不是完美的，就像“没有免费的午餐定理”一样，这个社会就是在矛盾中发展的，hybrid技术需要懂得原生APP开发、前端开发、后台开发才能进行完成，因此开发成本高、维护成本也高。