什么是混合App(Hybrid App)
HybridApp是指介于web-app(网页APP,如京东web)、native-app(原生应用,如手机上面的APP应用)这两者之间的app,它看上去是一个NativeApp,但只有一个WebView ( WebView,可以类比成iframe ),里面访问的是一个WebApp,就是包了个客户端的壳,其实里面是HTML5的网页。
混合开发简介
现在app开发方类型有几种?
WebApp:就是在浏览器中运行的web应用
NativeApp:用android和Object-C等原生语言开发的应用
HybridApp:就是外面是原生的壳,里面是webapp应用,兼具2者的优势
企业如何选择用那种方式开发产品呢?
企业要根据自身的特点进行app开发方式的选择,不要为了混合而混合。
混合app的开发方式是未来的主流趋势。
移动端开发有哪些框架
主流的:Ionic、React Native
非主流:Html5+、AppCan、Jquery Mobile(主要用于做移动Web)
混合app Ionic (Html5+ AppCan) 需要提交到服务器上面做打包
原生app React Native RN
一. NativeApp(原生APP)
纯工具类APP
开发:Android、IOS工程师开发;
Android:java,xml 配置 java jdk , Android sdk eclipse编辑器
IOS:xml,Objective-C/swift, mac,Imac机上 XCODE
更新维护:版本更新、打补丁包 都得需要用户从app store里面进行下载
使用:必须去app-store里面进行下载更新才能使用软件
特点和优势:
1、流畅度较高
2、对网络的依赖性不强,在没有网络的情况下也可能使用部分功能
3、可以调用设备的原生功能
缺点:不能跨平台开发 必须开发两套代码(Android+IOS)
开发成本
开发成本较高,因为需要分开开发,不能跨平台开发,开发周期长,使用成本较高,因为需要下载安装,话费流量,并长期占用手机的内存
更新维护成本高
二、WebApp(移动M站)
特点:(凡是可以在移动端浏览器里面打开的网站都称之为WebApp)
使用: 无需下载 直接通过用户的手机浏览器打开使用即可
更新维护:直接无痕更新(需要注意浏览器缓存问题 缓存的产生是基于文件的路径)
开发:
1.web前端开发工程师
2.使用HTML5+CSS3+js,mac、pc上开发
3.更新维护成本低
开发成本:
开发成本较低,可以实现跨域平台,开发周期短(比较于原生)
使用成本低,不需要下载安装,通过浏览器空间
特点和优势
1、用户粘度低
2、流畅度较低
3、对网络的依赖性强
4、不能访问设备的原生功能!因为浏览器的安装级别限制
(同源策略、不能调用设备的原生功能及文件系统)
1
缺点:不稳定 流畅度低 用户体验差 不能调用原生设备
三. Hybrid App(混合App)
混合开发的app其实从根本上的技术就是在原生的壳子、界面里嵌入H5页面来实现功能
先决技术:H5页面是可以嵌入到原生的webview中的
开发模式:
1、原生主导
这是主流的一种方式,也就是说其实现在市场上的应用已经很少有春原生的了而是大多采用了混合开发的模式,一般都是原生主导的,也就是在某个界面中去嵌入h5页面
区分方式:
1.长按文字看是否被选中,如果能选中肯定是嵌入的H5页面
2.安卓打开开发模式,手机上就会出现很多的线条,线条包裹起来的就是原生的元素
为什么要这么做:
借助H5页面的跨平台属性来降低开发成本。因为内嵌应用电影、外卖,他们的webapp已经存在了,可以直接将webapp的页面嵌入进来
什么样的页面适合去嵌入H5页面
布局复杂,逻辑简单,经常更新卫华的,比如详情、部分列表等等都适合嵌入H5页面的方式
1.js判断操作系统
html中的window.navigator.userAng
2.js与native通信
native与js交互
1.ios可以调用window下面的方法
当跳转详情的时候,详情界面就可以调用里面H5页面的JSBridge的方法来传递参数
2.页面中发送所有的网络请求,webview