hybrid

hybrid

• hybrid即“混合”，即前端和客户端的混合开发。
• 需要前端开发人员和客户端开发人员配合完成
• 某些环节也可能涉及到服务器端

hybrid存在价值

• 可以快速迭代更新【关键】（无需app审核）
• 体验流畅（和客户端的体验基本类似）
• 减少开发和沟通成本，双端公用一套代码

webview

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

file协议和http(s)协议

• file协议：加载本地文件，快
• http(s)协议：网络加载，慢

不是所有场景都适合使用hybrid:

• 使用NA：体验要求高，变化不频繁（如今日头条首页）
• 使用hybrid：体验要求高，变化频繁（如今日头条的新闻详情页）
• 使用h5：体验无要求，不常用（如举报、反馈等）

hybrid的具体实现

• 前端做好静态页面，将文件交给客户端
• 客户端拿到前端静态页面，以文件形式存储在app中
• 客户端在一个webview中
• 使用file协议加载静态页面
  

总结

• hybrid是客户端和前端的混合开发
• hybrid存在的核心意义在于快速迭代，无需审核

hybrid和h5的区别

优点

• 体验更好，跟NA体验基本一致
• 可快速迭代，无需app审核【关键】

缺点

• 开发成本高。联调、测试、查bug都比较麻烦
• 运维成本高。参考更新上线流程

适用的场景

• hybrid： 产品型页面。产品的稳定功能，体验要求高，迭代频繁
• h5：运营性页面。单次的运营活动（如XX红包）或不常用功能

JS和客户端通讯

新闻页适用hybrid，前端如何获取新闻内容？

• 不能用ajax获取。原因：第一跨域，第二速度慢
• 客户端获取新闻内容，然后js通讯拿到内容，再渲染
  

JS和客户端通讯的基本形式

• JS访问客户端能力，传递参数和回调函数
• 客户端通过回调函数返回内容

schema协议：前端和客户端通讯的约定