APP内嵌h5

公司的移动端产品好多页面都是用h5实现的，我最近负责了一个新版本，在协调研发的过程中发现APP内嵌h5存在一些问题，好多效果h5都无法实现或者需要APP的配合，所以对这方面做了一些简单了解，整理记录到这里

原生APP

优点

• 运行速度比较快
• 能使用设备的底层功能，如摄像头、方向传感器、重力传感器、拨号、GPS、语音、短信、蓝牙等
• 在界面设计、功能模块、操作逻辑等层面相较web更易做到App的便捷性和舒适性，功能更加强大
• API稳定，可离线操作和本地存储，节省流量

缺点

• 不同的操作系统需要独立的进行开发，使用其各自的开发语言、开发包、开发工具和控件
• 开发和维护成本比较高，尤其需要适配各种机型时
• 更新需要发布新版本，且要向各个应用商店进行提交审核，之后用户需要手动进行点击更新安装（安装成本较高、开发周期长）

h5

优点

• 由于是运行在浏览器上，所以只需要开发一次便可以在不同的操作系统上显示
• 迭代版本时，不需要打包便可以发布（实时更新、快速迭代）
• 开发成本相对较低，对浏览器的适配较简单

缺点

• 对网络依赖强，速度无法保证。特别在弱网环境下，不仅耗费流量而且加载缓慢，就算是WiFi情况下也不容乐观
• 复杂或精细操作时对系统性能消耗大、体验差
• 无法使用很多移动硬件设备的独特功能
• 仍处于发展阶段，部分功能无法在基于现有技术的浏览器基础上实现，且无法全面的显示最完美的用户体验

怎样选择

原生APP

• 需要调起硬件设备功能，必须用原生页面来实现
• 需要缓存数据，可以进行离线操作时要用APP实现
• 需要大量的前后台数据交互，且需要保持稳定时需要APP实现
• 页面和功能比较固定，变动频率较低，且注重用户体验时可以选APP实现
• 主流程下比较重要的页面，需要APP实现良好的体验和保持稳定性

h5

• 经常会有变动和更新的页面可以选择用h5页面，更新页面的时候不需要将整个APP进行发布更新
• 处在尝试阶段的业务，如临时的活动页面，使用h5开发成本低且可以及时更新
• 不影响主流程的辅助性页面（如说明介绍页），可选择h5实现
• 更注重节约成本可以选择h5实现

尽早评估

目前APP内嵌h5还不够成熟， h5作为webView被APP控制，所以很多效果的实现都需要APP的配合，所以最好在正式进入开发阶段之前能够跟相关的开发人员做好评估，怎样实现是最优的方法，有问题尽早解决，不然一旦投入开发出现问题时迫于进度压力可能就需要改需求或设计，有可能失去较好的用户体验，甚至无法满足原始需求。当然评估是需要经验的，需要慢慢积累↖(^ω)↗