WebApp与原生App介绍

在智能手机上允许的App应用程序有NativeApp&＃xff08;基于本地操作系统运行&＃xff09;和WebAPP&＃xff08;基于手机浏览器运行&＃xff09;&＃xff0c;其中Native App就是原生App的意思&＃xff0c;所以原生App开发也就是指基于本地操作系统的App开发服务。如今市面上多数的App软件开发都是使用的原生程序编写的应用程序&＃xff0c;也就是说大部分的手机App属于原生App应用软件。

原生App访问和兼容的能力比较好&＃xff0c;可以支持在线或者离线消息推送或是进行本地资源访问&＃xff0c;以及摄像、拨号、蓝牙、功能的调取。原生App开发有很多的优势&＃xff0c;如原生App是针对不同的平台为用户提供不同的体验、原生应用可以节约宽带成本、访问本地资源、打开的速度更快并为用户提供最佳的用户体验和优质的用户界面等。

Web App是一种框架型APP开发模式&＃xff08;HTML5 APP框架开发模式&＃xff09;&＃xff0c;具有跨平台的优势&＃xff0c;该模式通常由“HTML5云网站&＃43;APP应用客户端”两部分构成&＃xff0c;APP应用客户端只需安装应用的框架部分&＃xff0c;而应用的数据则是每次打开APP的时候&＃xff0c;去云端取数据呈现给手机用户

1.开发方面

原生APP:每一种移动操作系统都需要独立的开发项目&＃xff0c;iphone版本、Ipad版本、安卓版本。每种平台都需要独立的开发语言。Java&＃xff08;Android&＃xff09;&＃xff0c;Objective-C&＃xff08;iOS&＃xff09;等等。需要使用各自的软件开发包&＃xff0c;开发工具以及各自的控件。开发成本高、开发速度慢、维护成本高。三个平台&＃xff08;IOS、安卓、windows&＃xff09;的规则、推广、运营都不相同。官方应用商城对APP上线审核流程比较复杂而且很慢&＃xff0c;会严重影响APP的发布上线。

Web App&＃xff1a;因为运行在移动设备的浏览器上&＃xff0c;所以只需要一个开发项目。可以通过HTML、CSS或者Javascript来进行Web App的开发。开发成本低、开发速度快。

2.功能方面

原生App&＃xff1a;原生APP是一个系统性的应用程序&＃xff0c;可以类比于电脑上的软件。原生app可以调用移动终端的硬件设备&＃xff0c;比如&＃xff1a;麦克风、摄像头、短信、GPS、蓝牙、重力感应等。实现功能丰富

Web App&＃xff1a;Web APP可以类比于电脑上的网页。Web APP更多是页面展示类的APP。只能使用有限的移动硬件设备功能。更多用于页面展示&＃xff0c;侧重于简单的交互&＃xff0c;无法使用很多硬件设备独特的功能。

3.应用安装使用方面

原生App&＃xff1a;需要通过应用商店将原生app下载到手机上或移动终端上。以独立的应用程序运行。用户必须手动去下载安装这些原生App&＃xff0c;原生应用可以节约宽带成本&＃xff0c;可以访问本地资源、缓存。

Web App&＃xff1a;通过移动设备上的浏览器访问&＃xff0c;软件更新只需要更新服务器就够了&＃xff0c;用户层面不需要做任何操作。不需要安装客户端&＃xff0c;可以节省手机终端的内存空间。

4.版本控制方面

原生App&＃xff1a;用户可以自有地选择是否更新软件版本&＃xff0c;所以会出现不同用户同时使用不同版本的情况。同时也会导致维护成本比较高。使用旧版本的用户无法体验新版本的完成功能。

Web App&＃xff1a;所有的用户都是用同样的版本&＃xff0c;所有用户获得的功能都是相同的。版本更新比较方便&＃xff0c;直接在服务器侧更新数据即可。一个功能做好了就能上线&＃xff0c;一天更新几十次都毫无压力。如果客户端只是哥浏览器&＃xff0c;那一切都会变得很简单。另外web统一性高&＃xff0c;跨平台使用时开发量少。由于其入口不明显&＃xff08;浏览器导航或者随意点击链接进入&＃xff09;&＃xff0c;让用户记住的门槛也随之拔高&＃xff0c;每次推广导入的流量都可能沦为一次性努力&＃xff0c;用户留存率低。

5.加载速度方面

原生App&＃xff1a;原生APP由“云服务器数据&＃43;APP应用客户端”两部分构成&＃xff0c;APP应用所有的UI元素、数据内容、逻辑架构安装在手机终端上。访问的时候&＃xff0c;不需要重新下载加载应用页面架构&＃xff0c;只需要加载数据即可。所以加载速度更快&＃xff0c;页面响应更快。

Web App&＃xff1a;而Web APP打开一个页面&＃xff0c;都需要重新加载页面的所有元素&＃xff0c;访问速度受手机终端性能和网络环境的限制&＃xff0c;导致加载速度慢&＃xff0c;而且操作频繁容易卡死。

Android WebView在Android平台是一个特殊的View&＃xff0c;它能用来显示网页&＃xff0c;这个WebView类可以被用来在app中仅仅显示一张在线的网页&＃xff0c;当然还可以用来开发浏览器。

WebView内部实现是采用渲染引擎(WebKit)来展示view的内容&＃xff0c;提供网页前进后退、网页放大、缩小、搜索等功能。

WebView是一个基于WebKit引擎、展现Web页面的控件&＃xff0c;Android的WebView在低版本和高版本采用了不同的WebKit版本内核。

简单的说就是这个组件可以使软件中显示在线网页&＃xff0c;如果组件丢失或失效&＃xff0c;软件就无法在其界面中显示在线网页所以导致了闪退。

//WebView显示外部网页
webview.loadUrl(&＃39;http://slashdot.org&＃39;);
//WebView加载本地资源
webview.loadUrl(&＃39;file:///android_asset/test.html&＃39;);
//WebView显示html语句
String summary&＃61;"You scored192points.";
webview.loadData(summary,&＃39;text/html&＃39;,null);
WebView使用场景

常用在一些交互比较少&＃xff0c;变化比较快的场景&＃xff1a;电商活动页面。

它是ui专门设计&＃xff08;和操作系统风格无关&＃xff09;

混合开发的App(Hybrid App)就是一个在App中内嵌一个轻量级的浏览器&＃xff0c;一部分原生的功能改为H5来开发&＃xff0c;这部分功能不仅能够在不升级App的情况下动态更新&＃xff0c;而且可以在Android或iOS的App上同时允许&＃xff0c;让用户的体验更好又可以节省开发的资源

当一个H5页面上有一个按钮或链接&＃xff0c;我能不能够跳转到Native App的某个页面&＃xff1b;比如我点了H5页面上的分享按钮&＃xff0c;我能不能调用Native App的分享功能&＃xff1b;比如在页面正在加载的时候能不能获取Navtive App的用户信息等等。

一般来讲&＃xff0c;我所知道的两种主流的方式就是

1. js调用Native中的代码
2. Schema:WebView拦截页面调跳转

第二种方法实现起来很简单&＃xff0c;但是一个致命的问题就是这种交互方式是单向的&＃xff0c;H5无法实现回调。如果需要变得复杂&＃xff0c;假如H5需要获取Native App中的用户信息&＃xff0c;那么最好使用js调用的方式。例如&＃xff1a;我们通过淘宝客户端进入天猫的h5页面购物&＃xff0c;在这种情况下&＃xff0c;我们就需要webview页面获取登录用户的信息