1.hybrid是什么,为何使用hybrid呢?

  1. 概念:

    • hybrid就是前端和客户端的混合开发
    • 需要前端开发人员和客户端开发人员配合完成
    • 某些环节也可能会涉及到server端
    • 大前端:网页、APP、前端和server端交互的过程
  2. 存在价值:
    • 可以快速迭代更新【关键】,无需APP审核(hybrid技术可以一天上线多次)
    • 体验流畅(和Native开发的体验基本类似)
    • 减少开发和沟通成本,双端公用一套代码
  3. webview:
    • 是APP中的一个组价(App可以有Webview,也可以么有)
    • 主要用于加载H5页面,是一个小型的浏览器内核
  4. file:// 协议
    • file协议: 本地文件,快
    • http(s): 网络加载、慢
    • 扩展知识:Web标准都有哪些呢?

2.hybrid的具体实现流程?

2.1 使用场景

  1. 不是所有场景都适合使用hybrid
  2. 使用NA: 体验要求极致,变化不频繁(如头条的首页)
  3. 使用hybrid:体验要求高,变化频繁(如头条的新闻详情页面)
  4. 使用H5: 体验无要求,不常用(如举报、反馈等页面)

2.2 具体实现

  1. 前端做好静态页面(HTML,CSS,JS),将文件交给客户端
  2. 客户端拿到前端静态页面,以文件形式存储在APP中
  3. 客户端在一个Webview中
  4. 使用file协议加载本地静态文件

3.介绍一下hybrid更新和上线的流程?

3.1 优点

  1. 用户体验更好,跟NA体验基本一致
  2. 可以快速迭代,无需app审核 【关键】

3.2 缺点:

  1. 开发成本高:联调、测试、查bug都比较麻烦
  2. 运维成本高。(平台维护)

3.3 适用场景:

  1. hybrid:产品的稳定功能,用户体验高,迭代频繁
  2. H5:单词的运营活动(如XX红包),或不常用的功能

4.前端JS和客户端如何通讯?

  1. 类似于JSONP的数据请求方式
  2. schema协议的简介和使用
  3. 通讯的基本形式:调用能力,传递参数监听回调
  4. 对schema协议的理解和使用
  5. 调用schema代码的封装
  6. 内置上线的好处:更快、更安全

【前端知识体系-JS相关】对移动端和Hybrid开发的理解?的更多相关文章

  1. 【前端知识体系-JS相关】JS基础知识总结

    1 变量类型和计算 1.1 值类型和引用类型的区别? 值类型:每个变量都会存储各自的值.不会相互影响 引用类型:不同变量的指针执行了同一个对象(数组,对象,函数) 1.2 typeof可以及检测的数据 ...

  2. 【前端知识体系-JS相关】ES6专题系列总结

    1.如何搭建ES6的webpack开发环境? 安装Node环境 node -v // 10.14.1 安装NPM环境 npm -v // 6.4.1 安装babel npm install @babe ...

  3. 【前端知识体系-JS相关】JS-Web-API总结

    2.1 DOM操作 2.1.1 DOM的本质是什么? <!-- DOM树:二叉树 --> /* <?xml version="1.0" encoding=&quo ...

  4. 【前端知识体系-JS相关】深入理解JavaScript异步和单线程

    1. 为什么JavaScript是单线程? JavaScript语言的一大特点就是单线程,也就是说,同一个时间只能做一件事.那么,为什么JavaScript不能有多个线程呢?这样能提高效率啊. Jav ...

  5. 【前端知识体系-JS相关】深入理解MVVM和VUE

    1. v-bind和v-model的区别? v-bind用来绑定数据和属性以及表达式,缩写为':' v-model使用在表单中,实现双向数据绑定的,在表单元素外使用不起作用 2. Vue 中三要素的是 ...

  6. 【前端知识体系-JS相关】组件化和React

    1. 说一下使用jQuery和使用框架的区别? 数据和视图的分离,(jQuery数据和视图混在一起,代码耦合)-------开放封闭原则 以数据驱动视图(只关注数据变化,DOM操作被封装) 2.说一下 ...

  7. 【前端知识体系-JS相关】10分钟搞定JavaScript正则表达式高频考点

    1.正则表达式基础 1.1 创建正则表达式 1.1.1 使用一个正则表达式字面量 const regex = /^[a-zA-Z]+[0-9]*\W?_$/gi; 1.1.2 调用RegExp对象的构 ...

  8. 【前端知识体系-JS相关】你真的了解JavaScript编译解析的流程吗?

    1. JS编译解析的流程 1.1 JS运行分三步 语法分析(通篇扫描是否有语法错误),预编译(发生在函数执行的前一刻),解释执行(一行行执行). 1.2 预编译执行分五步 创建AO对象(Activat ...

  9. 【前端知识体系-JS相关】深入理解JavaScript原型(继承)和原型链

    1. Javascript继承 1.1 原型链继承 function Parent() { this.name = 'zhangsan'; this.children = ['A', 'B', 'C' ...

随机推荐

  1. SpringMVC跟Struts2的区别

    SpringMVC跟Struts2的区别 1.SpringMVC的入口是servlet:Struts2的入口是Filter. 2.SpringMVC性能方面会比Struts2好一点,SpringMVC ...

  2. 前端之javascript2

    js组成和标签获取元素 javascript组成 1.ECMAscript javascript的语法(变量.函数.循环语句等语法)2.DOM 文档对象模型 操作html和css的方法(比如通过id或 ...

  3. EF框架访问access数据库入门(后附官方推荐“驱动”版本)

    vs2017调试通过. 1.添加需要的provider,有点添加驱动的意思.右击项目,NUGET “浏览”,“JetEntityFrameworkProvider”,安装,如图 完成后配置文件(控制台 ...

  4. excel 知识备忘

    public void UpdateShapesColor(string value) { foreach (Microsoft.Office.Interop.Excel.Shape chart in ...

  5. vue-商品管理案例改进

    案例改进 vue-resource全局配置: Vue.http.options.root = 'http://vue.studyit.io/'; 全局启用 emulateJSON 选项 Vue.htt ...

  6. Implement Custom Business Classes and Reference Properties 实现自定义业务类和引用属性(XPO)

    In this lesson, you will learn how to implement business classes from scratch. For this purpose, the ...

  7. 垃圾分类环保宣传 PPT模板

    模板来源:http://ppt.dede58.com/peixunyanjiang/26263.html

  8. TCP三次握手四次分手—简单详解

    关于TCP三次握手四次分手,之前看资料解释的都很笼统,很多地方都不是很明白,所以很难记,前几天看的一个博客豁然开朗,可惜现在找不到了.现在把之前的疑惑总结起来,方便一下大家. 疑问一,上图传递过程中出 ...

  9. Qt开源编辑器qsciscintilla的一些用法

    首先放一张自己做的软件中的编辑器的效果图 中间红色的框就是放在Qt的tabwidget控件中的qsciscintilla编辑器 先从官网下载qsciscintilla源码,在qtcreater中编译, ...

  10. GCD的Queue-Specific

    为了能够判断当前queue是否是之前创建的queue, 我们可以利用dispatch_queue_set_specific和dispatch_get_specific给queue关联一个context ...