［iOS］关于 App 混合（Hybrid）开发的优化，包括H5Weex等（本篇博客主要针对 iOS 应用讲解，但该思想同样适用于Android）

Posted 2020-09-17 你的小码哥

　　我们知道混合开发，可以节省很多成本（时间成本，经济成本等等），所以有很多公司比较钟爱这种开发形式，今天所讲的优化方式，也是我在我们公司的应用中实际用了的，而且我写的这个优化的 SDK 已经开源到 github 上了，有兴趣的同学可以下载来看一下，有不足的地方欢迎指正。这里给出链接：https://github.com/zhangxu0302/HotUpdateTest

转载请注明出处：http://www.cnblogs.com/shisishao/p/6830736.html

－、首先，先介绍下什么是混合开发：

　　我们通常把移动开发分为Web、Native和Hybrid，但其实Hybrid又可以细分的。最简单的是在Native中放一个WebView，然后加载一个兼容手机的网站，其实就相当于在用户的手机上建立一个快捷方式，也算是占据用户桌面的应急用法吧。用这种方法要注意检测网络是否正常，不正常要给予提示，否则苹果是不予通过的。第二种是将Web相关文件全部放在本地，数据库一样用Sqlite做本地存储，用户就算不联网也能工作，或者是以Native为主，在某些特定的模块才会用到WebView。

　　其实要我说，只有第二种才算是真正的Hybrid。很重要的一点是Native和Web有没有交互，没有的不算，你直接在WebView中加载一个html页面，这算哪门子的Hybrid开发，这种也谈不上什么技术含量了，没什么好讲的。这种开发很难模拟Native的体验，用户一眼就看出这是网页，我说的Hybrid开发是那种多数用户看不出差别的，本篇博客也是针对于第二种形式进行优化的。

 

二、根据策略，实现不同场景的优化：（这里我们以 Web build生成的 js 文件为例，当然 Weex 也是同样的道理）

　　1、如果你的应用中的 js 文件是部署到远程服务器的，也就是说每访问一个 Web 界面，都是根据 Url 去下载该页面的js文件然后再加载出来，这个时候其实就有个弊端了，也就是我每次进入同一个界面，都要下载一次该界面的 js 文件。那有没有办法，让我只需要下载一次，下次再进入就不用再下载，而是直接加载已经下载好的呢？答案是肯定的。接下来，我们就重点讲解，如何实现这个办法：就是应用启动的时候，我们先去下载所有 js 的压缩文件包-->然后解压-->替换-->访问-->加载，具体实现：

　　（1）每次应用启动的时候，我们先请求一个后台接口，用来告诉我们：有没有新的 js 包要下载和下载地址，如果有就去下载，这个时候就有问题了，如果我的 js 包还没下载完成我就点进了某个 Web 界面怎么办，这个时候不就显示不出来了吗？别急，我们不是还有线上的服务器嘛，所以，每访问一个 Web 界面，我们先要判断本地（沙盒中或者叫硬盘中）有没有相应的 js 文件（可以根据Url链接来判断），如果有就访问本地的 js 文件，如果没有就去远程下载。这个时候不就解决了 js 包没下载完成就进入界面的问题了嘛，哈哈完美，所以，既然我们说的是优化，就不可能影响正常使用，而是在正常使用的基础上提升用户体验，要不怎么能叫优化呢。

　　（2）更新 js 包：每次更新线上服务器的 js 文件的时候，这个时候应用要下载的 js 包也要一起更新，也就是要保持两份文件统一。

　　2、如果你的应用中的 js 文件是集成在工程中的，也就是在你的 .ipa 包中。这个时候也会有一定的弊端，比如，我本身的Native代码没有什么更新，但是我的 js 文件更新了，这个时候就需要到 AppStore 上传一个新的版本，然后等待苹果漫长的审核。那有没有办法，让我在不提交新版应用的情况下更新掉旧的 js 包呢？当然是有办法滴呀，接下来就是见证奇迹的时刻：

　　（1）这种场景跟第一种更新的方式大同小异，就是在每访问一个 Web 界面，我们先要判断本地（沙盒中或者叫硬盘中）有没有相应的 js 文件（可以根据Url链接来判断），如果有就访问本地的 js 文件，如果没有就访问工程中集成的 js 文件。

 

三、总结

　　本次所讲的优化主要是，能提升用户体验，不至于让用户一打开你的应用就给人一种很 low 的感觉。各种 Web 界面都要加载半天，还有可能加载失败的情况。如果有同学想要优化这块东西的可以参考我上面说的我自己写的那个 SDK，场景考略的还是比较全了，因为是我们自己的应用在用，有什么问题欢迎留言讨论。