JS问题整理与思考--Hybrid 实现流程及适用场景

hybrid 存在价值

  • 可以快速迭代更新【更新】(无需app审核,原生方法涉及到各种权限,所以要审核)
  • 体验流畅(基本和NA的体验基本类似)
  • 减少开发和沟通成本,双端公用一套代码

不是所有场景都适合用hybrid

  • 使用NA:体验要求极致,变化不频繁
  • 使用hybrid:体验要求高,变化频繁
  • 使用h5:体验无要求,不常用。(如举报/反馈等页面)

webview

  • 是app中的一个组件(app可以有webview,也可以没有)
  • 用于加载h5页面,即一个小型的浏览器内核

file 协议

  • 中文意思:本地文件传输协议
  • 使用:file:///文件路径
  • file协议:本地文件,快
  • http(s)协议:网络加载,慢

file协议为什么三个斜杠 /// ,http里两个斜杠 //

scheme:[//[user:password@]host[:port]][/]path[?query][#fragment]

http://www.baidu.sb:80/ad/cas

在file中,没有host部分,所以前面两个斜杠和后面一个叠加file:///f:/aa/1.jpg

其中,前面两个斜杠也可以省略,变成file:/f:/aa/1.jpg

hybrid实现流程

  • 前端做好静态页面(html,js,css),将文件交给客户端
  • 客户端拿到前端静态页面,以文件形式存储在app中
  • 客户端在一个webview中,使用file加载文件

hybrid是什么,为什么存在hybrid

  • hybrid是客户端和前端的混合开发
  • 存在的意义在于跨素迭代,无需审核
  • hybrid实现流程,以及webview和file协议

hybrid 更新和上限流程

  • 分版本,有版本号,如201803211015
  • 将静态文件压缩成zip包,上传到服务器
  • 客户端每次启动,都去服务端检查版本号
  • 如果服务端版本号大于客户端版本号,就去下载最新zip包
  • 下载完之后解压包,然后覆盖现有文件

hybrid和h5的对比

hybrid的优点

  • 可以快速迭代更新【更新】(无需app审核,原生方法涉及到各种权限,所以要审核)
  • 体验流畅(基本和NA的体验基本类似)

hybrid的缺点

  • 开发成本高。联调/测试/查bug都比较麻烦
  • 运维成本高。服务端搭平台,分版本。客户端要验证版本,解压下载等

适用的场景

  • hybrid:产品的稳定功能,体验要求高,迭代频繁。适用于产品型
  • h5:单次运营活动(如XX红包)或不常用功能。适用于运营型

随机浏览