React Native 相比于其他移动端框架 (比如 PhoneGap、Cordova 和 Ionic) 又如何呢? 现在我们来深入这些问题。坐稳了!...React Native 与 Cordova 相比如何? 到底什么才是“原生”应用? 要理解“原生化” (nativeness) 的真正含义,先看下面: ?...另外一个阵营就是以 Cordova/PhoneGap 和 Ionic 为代表的。这些框架可以让 Web 开发人员使用他们已经具备的 HTML、CSS 和 JavaScript 技能来开发应用。...React Native 要比 WebView UI 原生得多 像 Cordova 这样的框架可以使用 Web 技术来开发移动 UI 。它们是如何做到的呢?...总结 好了,我们已经介绍了“原生”的真正含义、什么是 WebView UI 、为什么 React Native UI 更好,以及 React Native 相比于像 Cordova/PhoneGap 和
而结合的方式则有两种: React Native 与 Cordova 是两个不同的视图,使用时从 Cordova 跳转 React Native,再由 React Native 转回 Cordova。...React Native 与 Cordova 结合的两种方案 React Native 结合 Cordova 这种方案的主要优点在于:集成很方便,只需要集成两个 Activity 就好了,就几天的工作量...React Native 嵌入 Cordova WebView 在 React Native 中嵌入 Cordova WebView 并不是一件容易的事,对于我们而言,工作量大概是一两个月。...由于框架设计的原因,从 WebView 里跳转到 React Native,已经不是什么问题。...window.postMessage(JSON.stringify({ 而从 React Native 返回到 WebView 也不算是什么问题。
概述 Cordova 和 PhoneGap 的区别?...PhoneGap 是 Apache Cordova 的一个分发版,就像 Ubuntu 是基于 Linux 的一个发行版,其代码库也基于 Cordova,只是 PhoneGap 关联了 Adobe 的一些额外的商业工具或服务...优点 不懂原生开发,不懂后台语言就可完成APP 缺点 更新速度快,版本不够稳定 面向不懂App开发人群,不适合程序员和科技公司,过度依赖会降低技术水平 React Native 概述 React Native...最终产品是一个真正的移动应用,从使用感受上和用Objective-C或Java编写的应用相比几乎是无法区分的。 React Native所使用的基础UI组件和原生应用完全一致。...React Native、Weex等有什么不同? React Native、Weex等一直存在一个问题,就是性能跟原生App存在很大的差异。
前言 提到跨终端应用开发,很容易想到最近很火的React Native。使用React Native开发出的APP本质上是Native APP。...(以上描述摘自百度百科) Cordova最早的名称是PhoneGap,后来被Adobe收购,Adobe将PhoneGap的核心代码抽出,贡献给Apache作为开源项目。...Adobe在Cordova的基础上加上自己的特性和生态,继续沿用PhoneGap的名字。而原本的PhoneGap的核心代码以Cordova这个名字作为Apache的一个开源项目。...目前Cordova与PhoneGap的关系类似于Webkit和Google Chrome的关系。 Cordova支持多个终端平台,可以凭借这一点,实现一处编写前端代码,在各种平台上处处运行。...基于Cordova的Hybrid APP的基本原理如下图(图片是较早时候的PhoneGap,与Cordova原理相同): ?
本文作者:IMWeb coolriver 原文出处:IMWeb社区 未经同意,禁止转载 前言 提到跨终端应用开发,很容易想到最近很火的React Native。...使用React Native开发出的APP本质上是Native APP。在跨端应用开发这一领域内还有另一块:Hybrid APP。...(以上描述摘自百度百科) Cordova最早的名称是PhoneGap,后来被Adobe收购,Adobe将PhoneGap的核心代码抽出,贡献给Apache作为开源项目。...Adobe在Cordova的基础上加上自己的特性和生态,继续沿用PhoneGap的名字。而原本的PhoneGap的核心代码以Cordova这个名字作为Apache的一个开源项目。...基于Cordova的Hybrid APP的基本原理如下图(图片是较早时候的PhoneGap,与Cordova原理相同): ?
Phonegap Build Phonegap Build是一个在线打包工具,你把使用cordova写好的项目给Phonegap Build,Phonegap Build就会在线打包成App。...全新的Phonegap诞生,他继承了Phonegap Build和cordova ,由此phonegap在混合开发领域变得异常响亮,导致,我们不需要线上打包能力,只使用cordova时,也被叫做使用Phonegap...Native横空出世 React Native React Native (简称RN)是Facebook于2015年4月开源的跨平台移动应用开发框架,是Facebook早先开源的JS框架 React...RN和普通混合开发的区别就是React Native 采用不同的方法进行混合移动应用开发。...它不会生成原生 UI 组件,而是基于 React,React Native 是一个用于构建基于 Web 的交互界面的 JavaScript 库,因此会有更丰富的 UI 体验效果,同时也能够很好地调用底层框架的
在半年前的那篇《我们是如何将 Cordova 应用嵌入到 React Native 中》中,我介绍了如何将 Cordova 嵌入 React Native 应用中。...考虑到有大量的 Cordova 应用,会在未来迁移到 React Native 中,便写了 Dore。...Dore 是一个使用 React Native 实现的 WebView 容器,可以让你在 WebView 调用 React Native 组件。...其设计初衷:用于迁移 Cordova 的 WebView 应用到 React Native 的 WebView。 ? 当然,仍然有更多的插件在开发之中,为了训练一下我编写原生代码的能力。...(by react-native-permissions) State StatusBar Toast (by dore-toast) Vibration 还有其它插件,等着你来一起开发。
所以,混合技术栈其实是 Web 技术栈 + 容器技术栈,典型代表是 PhoneGap、Cordova、Ionic 等框架。...Adobe 公司将 PhoneGap 的核心代码,后来都捐给了 Apache 基金会,作为一个全新的开源项目,名为 Apache Cordova。 ?...PhoneGap 和 Cordova 现在是两个独立发展的开源项目,但是彼此有密切的关系,可以简单理解成 Cordova 是 PhoneGap 的内核,PhoneGap 是 Cordova 的发行版。...(3)React Native 的问题 React Native 的想法虽然很美好,但是实际开发中出现了各种各样的问题。...如果你想用 React Native 做到 iOS 和安卓体验一致,并且充分发挥原生控件的功能,就需要同时熟悉 React Native、iOS、安卓三个平台,这对开发者的要求实在太高了。
Hybrid相关的技术有很多,比如PhoneGap、Cordova、Ionic、VasSonic等等,我们大概来了解一下。...3.1 Cordova 说到Cordova,不得不提到他的前身PhoneGap,PhoneGap面向Web开发人员,通过使用HTML、CSS和Javascript构建跨平台App。...2011年,Apache收购了Nitobi Software和它的PhoneGap产品,并对PhoneGap进行开源,PhoneGap 2.0版本时,产品更名为Apache Cordova。...,因此在2015年发布了React Native。...对于每台手机设备,应用可以从多个系统入口,引用用户体验产品。 与React Native和Weex相比主要有两点不同: 快应用自身不支持Vue或React语法,它采用的是JavaScript开发。
框架的核心是从Web的角度去开发手机应用,框架是基于PhoneGap编译平台。...(2) Cordova Cordova:Cordova的前身是PhoneGap,2011年Adobe公司收购了PhoneGap将其开源,并捐献给Apache,命名为Cordova。...Cordova从PhoneGap中抽出的核心代码。Cordova是一个使用HTML,CSS和JS这些前端语言去构建移动应用的平台。...(三)含有编译转换的框架 (1) React Native React Native:使用JavaScript 和 React 编写移动应用,在 UI方面使用是原生的控件,性能比Hybrid表现要好很多...React Native支持热更新也成了很多开发团队的热捧。 React Native于2015年3月v0.1.0: Initial public release版本。
加之,在上一个项目里,我做的是一个移动 Web 应用,从 Backbone 到设计基于 React 的原型,也积累了一定的移动开发经验。...就这样诞生了 PhoneGap/Cordova,它可以原生不动的运行 Web 应用。...同理于,React + Cordova,又或者是 Cordova + Weex。 在 Web 方面的经验比较丰富,没有足够的能力来支撑起 React Native 的开发。...与此同时,与 React Native 相比,Cordova 是通过 WebView 来执行 JavaScript,这到底仍然是浪费了一些资源。 ?...NativeScript 如果 Ionic 2 不能满足你的性能要求,React Native 又存在一定的学习成本、开发成本,那么我们也可以考虑迁移到 NativeScript 上。
优点: PhoneGap是一个开源的框架; PhoneGap 是一个基于HTML和JavaScript的应用开发平台,使用它可以构建本地应用; 支持8个移动应用开发平台(Android,iOS,Windows...学习路线陡峭; Ionic 框架相比于原生的 Cordova 有所差异,Cordova 某些官方插件可能不适用于Ionic; React Native 优点: 能够在Javascript和React的基础上获得完全一致的开发体验...可以达到每秒 60 帧(足够流畅),并且能有类似原生 App 的外观和手感; 如果你只想给现有的原生应用中添加一两个视图或是业务流程,React Native 也同样不在话下; 缺点: 对开发人员要求较高...,不是懂点web技术就行的,当官方封装的控件、API无法满足需求时就必然需要懂一些native的东西去扩展,扩展性仍然远远不如web,也远远不如直接写Native Code; 官方说的很隐晦:learn...Native 学习成本高; Flutter 属于小众语言,一切都要重新学习。
electron: 无依赖桌面端应用框架 flutter: 无依赖移动端应用框架 ionic: Angular移动端应用框架 ionic-conference-app: Ionic基础应用 ionic-native...: Ionic原生 ionicons: Ionic图标 nativescript: Angular移动端应用框架 ng-cordova: Angular移动端应用框架 quasar: Vue移动端应用框架...react-native: React移动端应用框架 stencil: Ionic原生 weex: Vue移动端应用框架 微信框架 mpvue: Vue小程序框架 wepy: Vue小程序框架 westore...: 无依赖小程序框架 脚手架 angular-cli: Angular脚手架 bruce-cli: React脚手架(本人开发,零配置开箱即用,强烈推荐) cordova-cli: Cordova脚手架...create-react-app: React脚手架 ionic-cli: Ionic脚手架 phonegap-cli: Phonegap脚手架 taro: Taro脚手架 vue-cli: Vue脚手架
一、混合开发几款移动跨平台App开发框架比较 1.PhoneGAP 2.Cordova 3.Dcloud 4.APICloud 5.APPCan 6.Lonic 主流的:Ionic、React...Native 非主流:Html5+、AppCan、Jquery Mobile(主要用于做移动Web) 二、移动跨平台方案 移动开发10年历程 React Native、weex、Flutter...1.React Native,是Facebook早先开源的JS框架 React 在原生移动应用平台的衍生产物,目前支持iOS和安卓两大平台。...android_跨平台.png 4.从本质上来讲,React Native 和 Weex 可以算作 Hybrid 的方案。...把它们和 Cordova 纯 HTML 开发的 App 进行对比的原因,是因为 React Native 和 Weex 都支持将资源文件(例如 HTML、CSS 或 JS)打包到 App 进行发布。
随着MEAP概念和技术的快速更新,MEAP平台呈现出多样化的特点,衍生出设备或移动OS厂商(Microsoft)、大型应用程序厂商(SAP)、开放源代码厂商(PhoneGap)和专业性公司(烽火星空、正益无线...越来越多的企业开始从移动应用生命周期的源头——开发环节出发,针对移动应用、设备进行统一全面的管控。...移动信息化研究中心通过对各开发平台的优点,以及各平台尚未涉及的功能进行汇总集合,提供一个理想化的产品功能指标列表,从客户端、服务端、开发工具三个维度给广大厂商及企业用户提供一些评测建议。...开源产品家族:PhoneGap/Cordova、React Native和Weex PhoneGap/Cordova React Native Weex 商用产品介绍:慧点科技、广州赛意、云适配、前海圆舟
electron建立在 Chromium 和 NodeJS 之上的,一个负责界面,一个负责背后的逻辑 Cordova,PhoneGap Cordova[ˈkɔːdəbə]是 hybride 类框架,基于...,随后将Phonegap的核心代码剥离并捐给了Apache公司,并改名为了Cordova。...核心的东西就是H5与Native的交互原理、Bridge、定义的解析规则(Engine) Cordova Application是Cordova框架独立于不同手机操作系统的一个封装层。...react-native 、weex 和 flutter 都只是 UI 框架,它解决的其实是跨平台上的 UI 实现,让界面布局或者实现的业务逻辑可以在多端统一。...但是它也仅仅只是 UI 框架,比如 react-native 本身就是依赖于原生控件,而 flutter 的 webview 、mapview 也都需要依赖原生开发来支撑。
react native环境搭建请移步:react native环境搭建 这里说说react native创建完成之后,运行中出现的常见问题, 问题1: java.lang.RuntimeException...这个是因为未找到运行的设备 解决方法:注意在运行命令:react-native run-android之前一定要确保手机已经连接上电脑。...这个是因为react-native版本升级了,但是在项目的build.gradle没有改成升级的版本号。...A:Android >= 4.1 (API 16) iOS >= 7.0 Q:RN和cordova/phonegap是一个东西吗? A:不一样。...RN的性能接近原生,超过cordova/phonegap。 Q:可以使用现有的js库吗? A:由于RN理论上更接近nodejs的运行环境,所以对nodejs的库兼容更好一些。
一方面伴随着移动互联网的高速发展,公司间竞争越来越激烈,如何将业务快速落地、快速试错,成为备受关注的问题。...Hybrid时期 在这个时期开始陆陆续续有一些跨平台开发框架出来,比较有代表性的有:Cordova、Ionic。...Cordova 时间:2009 Cordova的前身是PhoneGap,通过它可以使用HTML, CSS & JS进行移动App开发。...来自大洋彼岸的FB的工程师们做到了,他们将这个方案叫做React Native;React指的是React.js一个前端开发框架,通过JS+CSS开发;后面加个Native主要有两层含义: 这些”JS+...React Native 时间:2015 React Native是Facebook开源的一套基于React的跨平台开发框架。它的出现标志着跨平台开发框架进入了OEM时代。
1.React Native特点: 由Facebook开发,使用JavaScript和React构建跨平台应用。优点:跨平台支持(iOS、Android)。社区活跃,资源丰富。性能接近原生应用。...依赖Cordova/PhoneGap插件。4.Vue Native特点: 基于Vue.js,用于构建跨平台移动应用。优点:Vue.js开发者易上手。轻量级,学习曲线平缓。跨平台支持。...性能不及React Native和Flutter。5.Framework7特点: 专为构建iOS和Android应用设计的HTML框架。优点:提供原生外观和体验。易于集成到现有项目。丰富的UI组件。...总结React Native 和 Flutter 适合需要高性能和原生体验的项目。Ionic 和 Framework7 适合Web开发者快速构建应用。...Vue Native 和 Weex 适合Vue.js开发者。选择框架时需根据项目需求、团队技能和长期维护考虑。
跟React Native、Weex等有什么不同? React Native、Weex等一直存在一个问题,就是性能跟原生App存在很大的差异。...这跟它们的原理有很大的关系,下面从原生App,RN、Weex,Flutter的简单原理说一下它们的不同。...WebViews 最早的跨平台方案是基于JaveScript 和 WebView的,像PhoneGap、Cordova、Ionic等。 ?...React Native RN不仅桥接系统服务,也将系统UI也桥接到了JaveScript中,这样写出来的UI最终也会渲染成原生的控件。 ?
领取专属 10元无门槛券
手把手带您无忧上云