跨平台开发框架和工具集锦

本文版权归作者AWeiLoveAndroid所有,未经授权,严禁私自转载。转载请声明原文链接和作者信息。

经常看到大家在一些技术群热火朝天的争论跨平台技术的牛逼之处,其实是毫无意义的,尺有所短寸有所长,每个技术各司其职,没有好坏之分。争论有何意义?我们倒不如来研究一下,这个跨平台技术适不适用以及性能和稳定性等方面的做个比较。

一、为什么需要跨平台?

在移动端刚出来那会儿,Android、iOS都是各自为营,分开开发的,团队之间是独立的,从需求调研,研发,测试,上线一整套流程需要的周期很长,少则几个月,多达1年甚至更长。随着移动端的逐渐普及,移动端开发的市场也越来越大,互联网公司越来越多,争抢互联网蛋糕的人越来越多,各互联网公司之间的竞争越来越激烈,如何快速把好的想法推出去占有市场才是当前需要考虑的问题,在这样的形势下,为了适应市场的需求,减少成本开销,缩短开发周期,提高效率这些问题逐渐的被各公司关注。顺应市场变化的跨平台框架正好迎合了公司的需求,一拍即合,于是各种跨平台框架如雨后春笋般的在互联网公司开始普及开来。

二、跨平台框架的发展历史

俗话说:“读史使人明志",我想大家很有必要了解一下跨平台框架(工具)发展历史。为了搞清楚跨平台技术,我查证了许多资料,我在这里画了一张价值100w的跨平台框架的发展历史图,如下图所示。图中很清晰明了的概括了跨平台框架的一个发展历程。

根据跨平台的框架(工具)功能,我把跨平台框架(工具)主要分为3大类,分别是:Web App网页Hybrid框架含有编译转换的框架

(一)Web App网页

在智能机还没有出来之前,其实就有适用于手机端的网页了。Web App其实不算是严格意义上的App,我觉得应该把它称作网页端自适应移动版更合适。那时候网页一般是wap开头的,比如wap.xxx.com。后来有了3g网络之后,升级为3g开头的,比如3g.xxx.com,还有一种是以m开头的,比如m.xxx.com。我当年就用过诺基亚手机登陆腾讯家园逛QQ空间偷菜,现在手机腾讯网https://wap.3g.qq.com/还存在,其他的Web App,比如淘宝网手机版https://h5.m.taobao.com/ 就是一个Web App的案例,还有新浪网,网易新闻等都有自己的Web App站点。

采取这样的一种策略的优势:入门门槛低,只需要会HTML5、CSS3、JS前端语言就可以开发Web App了,开发成本低,内容更新也很方便,Web App无需安装,可以在不同系统、不同平台和设备上运行。

Web App缺点:用户体验比不上原生那么流畅,性能上比不上原生;有一些功能受浏览器、系统以及平台本身限制不好实现,比如系统级别的弹窗、传感器、手机联系人等都只能靠原生去实现(也不排除有些框架可以做到,比如:小程序可以通过自己引擎可以腾讯的浏览器内核引擎操作手机硬件)。本文首发于我的公众号Flutter那些事,未经授权严禁转载!

随着技术的发展,Web App已经是百花齐放,性能和原生效果方面都有很大的改善,新兴的Web App代表性的框架有:PWA小程序等。

(1) PWA

PWA: 全称是Progressive Web App,翻译成中文意思是:渐进式网络应用程序。它是 Google 公司于2015 年提出的,2016 年 6 月才推广的项目。

PWA优势:PWA可以将App的快捷方式放置在桌面上,全屏运行,体验上与原生几乎一致,支持有网和断网时使用。PWA不包含原生OS相关代码。

PWA缺点:PWA仍然是网站,只是在缓存、通知、后台功能等方面表现的更好。

PWA是Google主推的一项技术标准,FireFox,Chrome以及一些基于Blink的浏览器已经支持渐进式Web应用了,Edge上对渐进式Web应用的支持正在开发中,Apple公司也表示在Safari浏览器上支持PWA。国外互联网公司Twitter和Flipboard都推出了PWA的项目。由于网络环境因素以及小程序的竞争等原因,目前国内PWA的使用率几乎为零。

(2) 小程序

小程序:是一种无需下载安装即可使用的应用,只需要扫一扫或打开微信搜一下即可打开应用。2016年9月21日,微信小程序正式开启内测。

小程序的优势:小程序开发门槛相对较低,难度比开发App小,能够满足需求的简单的基础应用。小程序能够实现消息通知、线下扫码、公众号关联等七大功能。通过公众号关联,用户可以实现公众号与小程序之间相互跳转。由于无需下载App,小程序推广起来更方便。

小程序的缺点:小程序是依附于微信的,所以很多功能局限于微信团队提供的API,你不好扩展功能。另外小程序不适合开发交互复杂、需求多样的应用,只能考虑原生开发。

(二)Hybrid框架

Hybrid App,其实就是原生应用和Web应用相结合,一般做法就是项目中的某一部分是原生界面,一部分是Web页面,通过原生平台的WebView去调用Web页面。这种类似的开发模式就需要原生开发人员和前端开发人员密切配合(有些公司资源紧缺由单人负责这个项目)。 本文首发于我的公众号Flutter那些事,未经授权严禁转载!

由于原生WebView存在一定的局限性,和Web交互起来有些问题不好处理,于是出现了一些基于原生WebView封装的Hybrid框架,这些框架有一个共同特点:封装了移动端设备(这里指Android、iOS)上最常用的本地API调用,然后以统一的Javascript API形式提供给Web开发者调用。这样一来原生不能解决的问题可以用Web去处理,同时你也可以自己封装原生API,做成一些插件使用。

比较热门的Hybrid框架有Ionic、Cordova、DCloud:

(1) Ionic

Ionic: Ionic是一款开源的跨平台,可用于开发移动端的开发框架。框架的核心是从Web的角度去开发手机应用,框架是基于PhoneGap编译平台。Ionic底层打包使用 Cordova,Ionic自带丰富的Ionic UI样式,Ionic使用的是AngularJS前端框架。Ionic拥有丰富的命令操作,可以通过命令行工具快速创建Android和iOS项目,并且也可以编译成Android和iOS平台的应用程序,同时Ionic也支持自定义编写Android和iOS的插件。

Ionic从2013年11月份开始发布第一个Alpha版本,2015年5月v1.0.0 “uranium-unicorn” release版本发布。

(2) Cordova

Cordova:Cordova的前身是PhoneGap,2011年Adobe公司收购了PhoneGap将其开源,并捐献给Apache,命名为Cordova。Cordova从PhoneGap中抽出的核心代码。Cordova是一个使用HTML,CSS和JS这些前端语言去构建移动应用的平台。

Cordova自带丰富的命令操作,使用命令行可以创建类似于Web App的页面,在浏览器查看我们创建的项目,同时如果我们使用命令行将项目在移动端编译运行,也是可行的,这也是Cordova项目很独特的地方,兼容Web App以及移动端。

Cordova提供了一些操作原生设备有关的API,通过这些API,可以使用JavaScript去访问原生的设备的相关功能,例如打开摄像头、打电话、开启传感器等。比如拿Android来说,Cordova是通过addJavascriptInterface(Android Webview的API)和JS Prompt这两种方式来实现JS对于原生 Android API的调用。

Cordova的文档从2010年10月就开始维护了,版本号为0.9.2。 cordova-cli在2012年11月发布第一个版本,版本号为0.1.13。cordova-android这个从2009年12月就开始发布第一个版本0.9.0了。cordova-ios这个从2009年12月就开始发布第一个版本0.9.0了。

(3) DCloud

DCloud:这个是国产的跨平台开发工具平台,里面包含有:HBuilder,HTML5+,MUI,uni-app,wap2app等。HBuilder是一个开发工具,MUI是一个UI框架,HTML5+ App是一种基于HTML、JS、CSS编写的运行于手机端的App。

HBuilder可以通过扩展的JS API任意调用移动端的原生功能,实现与原生App同样强大的功能和性能,它封装了常用的扩展能力(二维码、分享等),同时通过Native.js把原生API映射成了JS对象,通过JS可以直接调iOS和Android的原生API(通过plus.ios调用iOS原生API,通过plus.android调用Android原生API)。

HBuilder工具从2013年就开始出现了。

(三)含有编译转换的框架

(1) React Native

React Native:使用JavaScript 和 React 编写移动应用,在 UI方面使用是原生的控件,性能比Hybrid表现要好很多。React Native因为是基于React,它是响应式编程,熟悉React的会很快上手,一次性学习,全平台开发,团队可以为任何平台开发应用,不需要为每个平台学习不同的基础技术。React Native支持热更新也成了很多开发团队的热捧。

React Native于2015年3月v0.1.0: Initial public release版本。

(2) Weex

Weex:Weex 是一个使用 Web 开发体验来开发高性能原生应用的框架。使用同一套代码就可以构建 Android、iOS 和 Web 应用。Weex 的结构是解耦的,渲染引擎与语法层是分开的,目前主要支持 Vue.js 和 Rax 这两个前端框架。Weex 在 iOS 和 Android 上都实现了一个渲染引擎,并提供了一套基础的内置组件。基于这些组件,你可以用JS封装更多的上层组件。

Weex于2016年6月开始发布版本,第一个版本号为v0.5.0。

(3) Flutter

Flutter: Flutter是谷歌推出的跨平台项目,它的前身是Sky项目,起源于2015年。Sky项目一开始就定位Dart作为开发语言,使用Dart语言开发移动端项目,Sky它不依赖于平台,它的代码可以运行在Android、iOS设备上,真正做到了“一次代码,处处运行”,让你在Android、iOS设备上拥有接近原生的体验。 本文首发于我的公众号Flutter那些事,未经授权严禁转载!

Flutter在2017年5月发布了第一个版本v0.0.6。

三、其他相关热门开发技术?

除上文讲解的之外,我还想提几个目前可以值得研究的一些技术,主要有这几个:Instant App快应用KotlinScade.

(1) Instant App

Instant App:Instant App翻译成中文可以称之为瞬时程序加载,也可以称之为即时应用。它出现的目的,就是为了让人们能够像点击链接那么简单,节省掉安装App的痛苦,最快速度、最少流量的消耗,让用户体验到App级的用户体验。前提是必须在Google Play发布apk,以及手机支持Google Service框架,建议优先使用谷歌亲儿子。由于墙以及谷歌的一些要求等问题,这个技术在国内并没有被推广开。

(2) 快应用

快应用:快应用是九大手机厂商基于硬件平台共同推出的新型应用生态。用户无需下载安装,即点即用,享受原生应用的性能体验。使用前端技术栈开发,原生渲染,同时具备H5页面和原生应用的双重优点。快应用在传统通知栏、负一屏、信息流等用户直观感知的位置建立和搜索入口,包括短信、拍照、语音助手、卸载场景、卡包等等。

(3) Kotlin

Kotlin:这里讲一下Kotlin Native,它利用LLVM来编译到机器码。它主要是基于 LLVM后端编译器(Backend Compiler)来生成本地机器码。Kotlin Native设计初衷是为了支持在非JVM虚拟机平台环境的编程,如 ios、嵌入式平台等。同时支持与 C 互操作。

(4) Scade

Scade:Scade是一个跨平台的,支持Android,Apple和Linux的工具。使用Swift的代码库为进行开发,可以构建和部署多个不同平台的应用。Swift代码编译为Android和iOS可执行文件以及静态和动态库,并打包为IAK和ADK文件。通用平台特定的控件直接集成到Scade图形SVG渲染引擎中,Scade标准库提供了大量系统功能,操作系统特定功能作为默认包公开并易于使用,无需包装或使用外部功能接口。


文首的图片来源于网页:http://www.sohu.com/a/50632196_128381


【声明】本文首发于我的公众号Flutter那些事,未经授权严禁转载!

本文参与腾讯云自媒体分享计划,欢迎正在阅读的你也加入,一起分享。

编辑于

我来说两句

0 条评论
登录 后参与评论

相关文章

来自专栏java一日一条

10 个最适合 Web 和 APP 开发的 NodeJS 框架

在浏览器以外运行 JavaScript 对于 JavaScript 爱好者来说非常神奇,同时也肯定是 web 应用程序开发界最受欢迎的进步之一。全球各地的开发者...

62420
来自专栏phodal

最流行的编程语言JavaScript能做什么?

首先很遗憾的一点是,“PHP虽然是最好的语言”,但是它不是最流行的语言。 ? 对不起的还有刚刚在4月TIOBE编程语言排行榜上榜的各个语言: ? 你们都很棒,...

36580
来自专栏极乐技术社区

小灯灯实战系列《一》记一次小程序开发过程

写在前面 前后两天花了大约四五个小时制作完了自己第一个小程序,当然是没法发布的,小程序的发布要求还是挺严格的:企业资质、HTTPS、审核。 先大概介绍下自己,我...

24170
来自专栏华章科技

推荐 12 款堪称神器的插件,提高工作效率必不可少

导读:工欲善其事,必先利其器,程序员的日常工作根本就离不开Chrome浏览器(还不知道的请面壁思过130s)!其他功能就不啰嗦了,今天来说说 Chrome 如何...

62220
来自专栏小程序·云开发专栏

《腾讯大家》小程序开发总结

《腾讯大家》是公司推出的中文互联网专栏写作服务产品。由于寻找有效信息的成本是非常大的,一些真正具有传播价值的内容,却往往淹没于信息洪流之中。如何将最有价值的信息...

44930
来自专栏不止是前端

实用主义:记一次个人主页制作

460100
来自专栏BestSDK

从初创到BAT,都必须遵守的4个用户体验设计细节

启动页 当用户打开 app 时,最不能做的事情就是让他们等待。但是如果 app 的初始设置非常耗时,又不可能优化该怎么办?你不得不让用户等。如果他们愿意等,你得...

31340
来自专栏王二麻子IT技术交流园地

一、VueJs 填坑日记之基础概念知识解释

概述 在最开始听说vuejs这个词是在2016年,当时天真的认为自己是个后端开发工程师不需要学习太多的前端知识,不过紧接着在2017年在公司就用到了vuejs。...

23080
来自专栏知晓程序

技术开发者怎么看微信小程序?值得一试,但……

17530
来自专栏FreeBuf

新年大作战:抵制恶意推广,守护老爸的旧电脑

每年过年回家,基本上都需要做一件事情:重新清理我爸电脑上的垃圾软件或者直接重装系统。 想我爸也是个国家级教师,平时工作使用电脑的频次并不低,却对于电脑这东西跟绝...

22560

扫码关注云+社区

领取腾讯云代金券