什么是混合App

Hybrid App是指介于web-app（网页APP，如京东web）、native-app（原生应用，如手机上面的APP应用）这两者之间的app,它虽然看上去是一个Native App，但只有一个WebView ( WebView,可以类比成iframe )，里面访问的是一个Web App，就是包了个客户端的壳，其实里面是HTML5的网页。

混合开发（HybridApp开发），是指在开发一款App产品的时候，为了提高效率、节省成本而利用原生与H5的开发技术的混合应用。通俗点来说，这就是网页的模式，通常由“HTML5云网站+APP应用客户端”两部份构成。

混合开发是一种取长补短的开发模式，原生代码部分利用WebView插件或者其它框架为H5提供容器，程序主要的业务实现、界面展示都是利用与H5相关的Web技术进行实现的。比如京东、淘宝、今日头条等APP都是利用混合开发模式而成的。

通俗来讲，就是将h5我们写好的移动端页面，放到ios设备以及安卓设备中，在里面 我们可以享受ios和安卓给我们的所有支持，通过方法调用，回调函数进行使用 给我们提供的方法

混合App开发的优点：

1. 开发效率高，节约时间。同一套代码Android和IOS基本上都可使用；
2. 更新和部署比较方便，每次升级版本只需要在服务器端升级即可，不再需要上传到App Store进行审核；
3. 代码维护方便、版本更新快，节省产品成本；
4. 比web版实现功能多；
5. 可离线运行。

混合App开发的缺点：

1. 功能/界面无法自定：所有内容都是固定的，不能换界面或增加功能；
2. 加载缓慢/网络要求高：混合APP数据需要全部从服务器调取，每个页面都需要重新下载，因此打开速度慢，网络占用高，缓冲时间长，容易让用户反感；
3. 安全性比较低：代码都是以前的老代码，不能很好地兼容新手机系统，且安全性较低，网络发展这么快，病毒这么多，如果不实时更新，定期检查，容易产生漏洞，造成直接经济损失；

混合开发简介

• 现在app开发方类型有几种？ 

1. WebApp:就是在浏览器中运行的web应用
2. NativeApp:用android和Object-C等原生语言开发的应用
3. HybridApp:就是外面是原生的壳，里面是webapp应用，兼具2者的优势

• 企业如何选择用那种方式开发产品呢？ 
  • 企业要根据自身的特点进行app开发方式的选择，不要为了混合而混合。 
    混合app的开发方式是未来的主流趋势。
• 移动端开发有哪些框架 
  主流的：Ionic、React Native 
  非主流：Html5+、AppCan、Jquery Mobile（主要用于做移动Web）
• 混合app Ionic （Html5+ AppCan） 需要提交到服务器上面做打包
• 原生app React Native RN

HTML5+

首先要认识Html5+联盟是什么？

HTML5中国产业联盟，简称“HTML5+联盟”，是为了更好的推进HTML5的商用、更好的为HTML5开发者服务而由产 业链主流厂商共同组成的一个联盟。 
联盟致力于整合产业链资源，建立围绕HTML5开发者的生态系统，通过产业链共同为HTML5开发者服务。 
W3C中国是联盟的指导单位。 
CSDN 和 DCloud 是联盟的秘书处单位。

Dcloud4个核心产品 

• HBuilder：是一款web开发工具。它能大幅提升开发效率，对程序员也设计了更人文关怀的UI，它包括最全面的语法库和浏览器兼容性数据。到现在 已经有两年的时间了，到现在大概有几十万的开发者在使用。
• 5+Runtime：是一个H5的增强引擎。这是一个可以去调用H5的能力和原生操作系统的产品。
• MUI框架：是高性能的前端框架，可用开发高性能App，也是目前最接近原生App效果的框架，可以有效解决HTML5原生开发中遇到的部分问题，同时体积也小。
• 流应用：会让用户感觉一点开就可以用，这也是颠覆现有的应用方式的主要因素，给最终用户去使用应用有更好的体验。
• 如果手机上安装用360手机市场的话，html5+开发的移动扫一下二维码,只需要一点点流量就能够使用了。

Html5+的优点 

• 提供了一个自定制的IDE工具，支持非常好，轻量级，甚至不需要安装直接解压缩就可以使用
• 开发出来的app的性能很好，用户体验很高
• 丰富的api支持，号称有40万+

Html5+的缺点 

• 打包比较麻烦，需要上传源码，有些公司可以不希望公开源码
• 从新学习样式

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

                            一把都是用用iframe标签来发送请求，也就是，事先定义号一个url，作为通信的地址，然后创建iframe去发送这个请求 
                    

2、H5主导的模式


        纯H5开发工程师借助一些工具去搭建native的外壳，这个应用的内部都是H5页面构成

    这种开发模式主要以来的是工具，(打包应用、调用设备原生功能的能力)
                    现有的技术栈
                        1、phoneggap(打包调试) + cordova(调用设备原生功能)
            
                        2、DCLOUD/APICLOUD
                                
                        3、ReactNative/weex（使用类似H5技术开发，但是开发出来的native app）

                    

            使用DCLOUD产品开发混合APP
                    
                    HBUILDER可以进行应用的开发、调试、打包
                    MUI是一个高效的前端框架，里面继承了很多native的效果


              H5+RUNTIE  用到调用设备原生功能的工具

              1、Hbuilder可以创建移动APP（hybrid app）

                2、在真机上进行应用的调试，必须保证手机能够连接上电脑
    
                Andriod：
                IOS：itunes   itools
                
                依靠基座来运行，第一次会给手机安装一个基座是一个app壳内嵌一个html兼容各种设 
                备，减少发版频率，节约开发成本
                通过jsBright操作底层操作权限
   Hybrid一般分为两类，
               1）放在远程，应用变得非常小，服务器更新及时更新，使用必须联网
               2）打包放在自己app内，使用不需要了联网，下载包变大，不能立即更新