h5混合跨平台app_h5混合开发

文章目录：

• 1、h5做app和原生app有什么区别？
• 2、H5混合开发app如何升级的方法
• 3、原生APP开发与混合APP开发，你选择哪一种
• 4、H5的跨平台是什么意思
• 5、H5混合app开发，比原生态app开发，便宜多少钱，按原生态5万的项目来看，混合的，多少钱
• 6、h5技术为啥开发app不火？反而倒是原生技术开发更为广泛应用？

h5做app和原生app有什么区别？

1.H5的性能很差，一般经常改的地方可以用H5，比如论坛，咨询之类的，而且限制也是很大，很多效果是没办法做到的。GUI框架的WebView普遍是这样的。如果一个APP全部由H5来做(不太可能，送审很可能被拒)，那么会显得非常卡。

2.用iOS SDK，如果实现热更新是比较麻烦的。对于论坛，咨询这种模块，动不动就改版，做起来比较头疼，用H5就很合适了。尤其在APP跨安卓和iOS的时候，这类模块如果直接用H5，那么就很容易共用。

H5网页App开发和纯原生的App的差距主要聚集在以下几个方面：

1、动画

动画有很多种，比如侧边栏菜单的滑入滑出、元素的响应动画、页面切换之间的过场等等，在H5之下的众多实现方法都没有办法达到纯原生的性能。一般这些的话有几种不同的选择：css3动画、javascript动画、原生动画。

css3动画非常的消耗性能，如果某一个元素用到css3动画可能还看不出来，但大面积或过场使用css3动画会让app低端手机体验非常差。最好的选择一般是通过框架调用底层的动画，但不管怎么样等于在原来的代码上包上了一层，性能还是不可避免的受到影响。

比如在一个新页面的载入上，如果调用底层动画要考虑的问题有两个，一个是本身资源页面的渲染问题，另一个是远程数据的获取。即便是这些动画能够很快的响应，但大量的css页面会导致渲染卡顿，滑入时可能会有白屏/机器卡顿的现象。为了解决这些性能问题又必须要用到预加载或模拟动画。即便是这样，滑入滑出的动画在低端的安卓机器上还是有很多问题，如果获取服务端数据处理的方式不合适，卡顿白屏的现象会更严重。具体看下面的数据获取方式。

2、获取服务端数据

首先要接受的是，这里的数据获取都是在资源页面上异步完成的，因为只有这样才能让这些资源页面完成预加载或者渲染。但是异步拿到的数据在填入页面中时可能会涉及DOM操作，众所周知，DOM操作非常消耗性能，如果页面小还好，页面稍大数据稍微复杂一点，频繁的DOM操作会导致明显的闪白。而且最重要的一点是，如果页面加载进来之后数据更新的速度太慢，也会让页面模板等待很长时间，对用户体验又不友好，总不能每次打开都像浏览器一样等待刷新是吧

这个问题如果没有得到解决，H5开发是很难承担大规模数据的页面，在它们之中频繁切换更是难上加难，那么肯定有人也会想到用MVVM的方式，其实我也写过一些基于MVVM的H5app开发，相对来说它们获取数据和更新数据的方式更敏捷更科学，但写的过程中又要注意很多H5独有的问题，这些问题在下面的页面切换里来讲。

3、页面切换

上面我们看到了几种不错的实现方式，比如预加载和模拟动画，甚至有批量的预加载，批量的截图模拟动画等等，虽然看起来很友好解决了不少问题，但事实上如果页面足够多就会引发另一个问题——页面的生存周期。

试想一下，如果引导页或者主页面缓存了5个子页面的资源，在跳转到响应的子页面时又会缓存这些子页面的下级页面资源，如此反复肯定会占据大量内存使APP的体验下降。那么怎么知道那些页面是需要的，最多缓存多少页面，什么时候结束哪些页面的生存周期呢？在我用过的很多H5APP的框架里都没有对这些问题有一个完美的解答，因此在页面较多内容较多的app开发中可能会因这些资源分配的问题降低性能。

这时候我们回过头来再看看MVVM的数据加载问题，实际上不管哪个MVVM框架，写过的人都知道管理这种新型的前端代码最重要的问题是内存的问题，你既要保证代码写的足够优雅没有任何内存泄露问题，也要考虑到在页面生存周期结束时它们的控制器/页面资源是否得到释放，这对全局有没有什么影响，在多个请求时也要合理的分配资源，甚至是复用这些父级页面传过来的缓存资源等等。较小的APP可能并不会有这些问题，如果你想用纯H5来开发大型app，这很可能会浪费你很多时间——而且结果还不会让你满意。

4、Android/iOS的区别

很多人都说纯H5app开发一次编写就能编译Android/iOS两种不同的APP，大大降低了成本。实际上这个观点本身就是值得怀疑的，如果你写过这类APP就能明白我在说什么，它们既不省事，又存在很多BUG，调试时尤其繁琐。举一个很简单的例子，Android和iOS在返回上一页的处理方式上就有明显的区别，iOS的顶部bar在全屏下怎样处理，Android机器出现smart bar怎样处理页面的布局，调用底层硬件时怎样区分不同的场景等等，你需要写一个又一个机型和系统的判断，然后分别在Android和iOS下调试，最后你却发现这并没有卵用，累的要死却什么没学到，只有一堆不知道什么时候会过时的经验。

现在做H5混合APP开发的人很多，但是纯H5却很年轻，很多问题都没有很好的解决，这几个是我在做这些APP时考虑最多的问题。最后说一个很少人注意到的H5优势，大家大谈H5APP时都是快速开发、低成本、多平台等等，但我却觉得它和很多APP开发方式相比有一个不同之处——图文混合的排版。正是这些复杂多变的CSS样式消耗了性能，但是它带来了排版的多样性，能够细致到每一个字宽行高和风格的像素级处理，才是H5的优异之处。

H5混合开发app如何升级的方法

当我们的app开发完成之后，无可避免的以后会进行产品升级，那么我们希望在客户的手机上让app进行自动升级，可以分为自动升级和手动升级。

自动升级：一般在客户app第一次打开首页的时候。

手动升级：在app界面提供一个升级的入口。

原生APP开发与混合APP开发，你选择哪一种

原生APP好，混合APP也好，其实并么有真正好的技术解决方案，只有是否满足客户需求的产品，我们并不是说一定的就是原生的好，也不是说混合APP就一定不好；

目前几个超级大型的APP都是混编的APP，微信，QQ，微博，支付宝，淘宝都是混编的APP，里面涉及的技术早就跨域了多个技术领域，原生技术有，混合H5技术更有，所以不能这么简单的说那个好；

技术永远都在进步，技术永远都在快速迭代，怎么用方便，怎么用解决问题，怎么用高效，怎么用跨平台，那就用什么。目前开发一个APP从JAVA，OC，swift，xcode，H5，,,可以用到很多种技术。并不会说一定限制掉，核心还是解决问题；

只是目前的趋势来说，混合开发的优势会越来越明显，虽然现在的混合开发被应用的有点两极化，一些稍微低端的，一些是超级App，但是确实能节省很多事儿；

目前跨平台的混合开发APP工具还是逐渐多了起来，国内就有不少，apicloud，appcan，一门APP，wex5这些都是做的稍微早的混合APP技术开发平台。 

H5的跨平台是什么意思

同一套代码兼顾不同平台，很多实现变成折中实现，一般用H5、CSS、JS这些语言就可以开发 APP了，而不用在专门的应用平台上来实现，比如在Windows环境下开发IOS、ADR的APP！

H5混合app开发，比原生态app开发，便宜多少钱，按原生态5万的项目来看，混合的，多少钱

混合开发APP不一定比原生的便宜！但是从你这个原生5万的角度出发，混合开发成本可能就只有1万左右是很正常的！

其实没有必要关注混合或者原生那个便宜，关键在于那个更加适合你！

通畅混合开发至少比原生开发人力成本节约五倍

h5技术为啥开发app不火？反而倒是原生技术开发更为广泛应用？

其实现在h5是很火的，而且一个应用不是一定适合某种技术，要看应用的类型来选择的。可以根据以下原则来选择：

1.如果APP中出现大段文字（如新闻、攻略等），且格式比较丰富（如加粗，字体多样），那么用H5会比较方便。原因是原生开发解析json对字符串格式处理不算很好。

2.如果讲究APP反应速度（含页面切换流畅性），则选用原生开发，因为H5其本质是网页，换页时，基本要加载整个页面，就像是浏览器打开一个新页面一样，显得较慢，而原生系统则只加载变化部分。

3.如果APP对有无网络、网络优劣敏感（譬如有离线操作，在线操作），那么，基本选用原生开发，虽然H5可以做到，但是很复杂。

4.如果APP需要频繁调用硬件（摄像头、麦克风、未来的湿度检测仪等等）那么，基本选用原生开发，这样支持硬件更多，更容易扩展，且调用速度更快，H5就望尘莫及了。

5.如果APP用户常见页面频换，如（淘宝首页各种不同活动），那么用H5，维护起来更容易。

6.如果预算有限（H5开发一套可跨平台覆盖安卓、ios，黑莓、塞班），不是很讲究用户体验，不在乎加载速度，那非H5不可。

列举那么多，实际上有个采阴补阳的方法是H5+原生混合开发，对于固定格式、页面速度要求高，的模块（如PDB的即时通讯、宝典、我的项目）采用原生开发，对于新闻、大段文字、资讯类的（如信息广场、发表、问吧等）用H5页面来加载，将其嵌入到原生框架中那么，可以达到比较良好的体验。