补一下 HybridApp 理论

1. 什么是WebApp

在手机端通过HTML ，css ，JS 技术开发的基于浏览器的一个应用

优势

开发成本低
适配多种移动成本低
跨平台和终端
迭代更新容易
无需安装成本

劣势

浏览器的体验相对原生差一些
消息推送不及时
调用本地文件系统能力弱

开发webApp

兼容性
页面布局
css3一些特性的使用

2：什么是NativeApp

是一种基于智能手机本地操作系统入IOS Android WP 并使用原生程序便携的第三方应用程序 ，也叫做本地app 一般使用开发语言JAVA C++ Objective-C

优势

提供最佳的用户体检，最优势的用户界面 更好的交互
针对不同平台提供不同体验
可节省宽带成本
可访问本地资源

劣势

移植到不同平台上比较麻烦
维护多个版本的成本比价高
需要通过store或者market确认
盈利模式与第三方分成
开发成本比较大

3：什么是混合式开发（HybridApp）

Hybrid App （混合模式移动应用） 是结合 web-app native-app 的app ，兼具Native App 良好用户交互体验的优势 和Web App 跨平台的开发的优势

或者说

是把 native和HTML5 的优势结合起来 ，开发一个hybridApp 的应用
一个app 里面 同时有native 和 html5

4：兴起的原因

html5 的技术日益成熟
native 成本高 迭代慢
跨平台

/————————/
HTML5 和Native 分别做哪些功能

1：规则 ：和Native 沟通商量
2：HTML5 做的
list列表
个人中心
表单提交
活动页面
3：Native 做的
性能要求高 不如首页
安全加密解密
稳定性 访问量
复杂的动画（css一样可以做）
系统的一些功能 （比如 扫码 调起相机）

/——————/
H5 如何调用Native 功能

现状
目前HTML5本身能力比较有限
HTML5的体验和原生相比有一些差距
如何调用

HTML5 如何调用java的函数方法

1：在Native Android app xml文件中 配置webWiew

2:在java代码中引用

3：java代码中定义类，在类中定义H5 调用的各个方法

4：js 调用 native

核心代码

 webWiew.addJavascriptEnabled(true)
 webWiew.addJavascriptInterface(new JsInterface(), "tcNs")

native 调用js 核心代码

btn.setOnClickListener(new View.setOnClickListener(){
    @Override
    public void Onclick(View v) {
        webView.loadUrl("javascript:Add(10,5)")
    }
})

如何打包

1：本地打包 提交我们的代码到代码仓库，native 工程师更新代码到他的项目目录

2：远程 webapp 项目调试完成上线后 ，把我们的地址把给native

开发遇到的坑

白屏问题
单元测试
1px的问题
升级带来的兼容问题
版本控制
性能问题

如何调试

打日志 console.log
让native 调试一下
wenire 调试

混合开发的框架（HybridApp）

Cordova