H5(WEB APP)和原生APP的优劣

用户头像
武汉/UI设计师/5年前/754浏览
H5(WEB APP)和原生APP的优劣
用户头像
Lucas_刘

浅谈原生APP、WEB APP、混合开发的优劣

H5(WEB APP)和原生APP的区别


一、原生APP & WEB APP的定义


【原生APP】

又称Native App,该开发针对IOS、Android、Windows等不同的手机操作系统要采用不同的语言和框架进行开发,该模式通常是由“云服务器数据+APP应用客户端”两部份构成,APP应用所有的UI元素、数据内容、逻辑框架均安装在手机终端上。


【WEB APP】

即是一种框架型APP开发模式(HTML5 APP 框架开发模式),该开发具有跨平台的优势,该模式通常由“HTML5云网站+APP应用客户端”两部份构成,APP应用客户端只需安装应用的框架部份,而应用的数据则是每次打开APP的时候,去云端取数据呈现给手机用户。



二、原生APP & WEB APP的区别


1、开发方面的区别


2、能力方面的区别

undefined


3、获取方法的区别


4、如何区分

关闭网络后,如果是整个的空白页,这个基本就是H5页面。如何页面还有控件基本就是原生的。

下拉刷新的时候H5会有一个明显的刷新现象,比如闪现、导航栏标题消失、加载较久、卡顿等。原生的下拉刷新没有明显现象,很平滑。

如果APP顶部导航栏当中出现了关闭按钮或者有关闭的图标,那么当前的页面肯定的H5,原生的一般不会出现

如果开发人员没有禁用掉WebView的长按手势,会弹出一个系统默认的快捷菜单:拷贝、查询、添加、分享。这个页面就是H5页面。

如果打开一个页面顶部有个进度条,就是H5页面。

H5页面点击 输入框,弹出的键盘上面一般都有“完成”按钮,原生的没有。



三、原生APP & WEB APP的优缺点


四、原生+H5混合开发优点(现平台使用开发模式)


使用场景:

原生:核心功能页面采用原生保证用户体验流畅性

H  5:非核心页面&阶段性的营销活动页面(特别是功能、布局等经常需要修改的需求)采用H5,遇到功能调整,可以快速发布


【优点】

1、开发效率高,节约时间。同一套代码Android和IOS基本上都可使用;

2、常用更新和部署比较方便,每次升级版本只需要在服务器端升级即可,不再需要上传到App Store进行审核;

3、代码维护方便、版本更新快,节省产品成本;


【缺点】

1、核心功能/界面无法自定:所有内容都是固定的,不能随时换界面或增加功能;

2、加载缓慢/网络要求高:混合APP数据需要全部从服务器调取,每个页面都需要重新下载,因此打开速度慢,网络占用高,缓冲时间长,容易让用户反感;

3、安全性比较低:代码都是以前的老代码,不能很好地兼容最新手机系统,且安全性较低,网络发展快,病毒多,如果不实时更新,定期检查,容易产生漏洞,造成直接经济损失;



3
举报
|
4
分享
相关推荐
评论
用户头像
评论你的想法~
表情
喜欢TA的作品吗?喜欢就快来夸夸TA吧!
推荐素材
【新年UI图标】钱包icon
【新年UI图标】体育icon
科技医疗透明柜UI界面设计
钱包ui模板
户外旅行飞机情侣假日出行
拟物风质感写实UI卡片合集源文件
新能源APP应用UIKit
【新年UI图标】秒杀icon
盲盒APP UI设计
APP/小程序商业项目UI模板|99个高保真UI+79个原型
【新年UI图标】汽车icon
手表表盘UI系列
3D卡通UI界面图标可爱插画免扣素
【新年UI图标】会员icon
UI 登录界面设计模板包
UI界面 组件
UI通用设计素材1
【新年UI图标】礼物/活动icon
新拟态风格 UI设计组件库
Security Camera UI kit
智能家居中心 简约 UI设计组件库
原创UIUX交互橙红渐变炫酷视觉平面设计作品集模板PSD
我的钱包-UI界面设计-app
你可能喜欢
相关收藏夹
大家都在看
登录注册