react native应用实例 移动应用有哪些

React Native 是一个 JavaScript 的框架,用来撰写实时的、可原生呈现 iOS 和 Android 的应用。其是基于 React的,而 React 是 Facebook 的用于构建用户界面的 JavaScript 库,但是这里不是给浏览器解释的,而是为移动平台。换句话说:如果你是一名 web 开发者,你可以使用熟悉的框架和单一的 JavaScript 代码库,即 React Native来撰写清晰的、高效的移动应用。
我们以前都听说过那些个通用的 app 开发,比如框架 Cordova 和 Titanium,那实际使用 React Native 是一种什么样的情况了呢?在本文中,我们会解释 React Native 到底是什么,以及其是如何工作的,再然后我们以撰写实际的 iOS 和 Android 应用来一探 React Native 究竟。在最后,希望读者能够看到有足够的理由在下一个移动应用中选择使用 React Native。
那么什么是 React Native?
在我们深入到开发的经历之前,我们先来探讨下 React Native是什么,并花一些时间来讲述下它是如何工作的。
也只是 React
React 是用于构建用户界面,通常是基于 web 的 JavaScript 程序库。由 Facebook 开发并在2013年将其开源,React 已经得到了颇为广泛的使用。但是其使用的范围比较狭窄,它仅是用于渲染用户的应用程序的界面,而不是更大的 MVC 框架。
React 让开发者们纷涌而至的原因有很多,诸如轻量级、骄人的性能、尤其是可以快速的变更数据。这均与它的组件结构密切相关,它也同样鼓励人们去撰写更加模块化的、可重用的代码。
React Native 也只是 React,但是是针对移动设备的。也有一些少许的不一样的地方,比如开发者需要使用&View&组件而不是&div&,&Image&代替&img&。开发者的体验多数是一致的。当然,有一些 Objective-C 和 Java 知识是非常有用的,移动开发有其自身的一些颇为棘手的问题(我在多个移动设备上测试过没有?触摸屏的目标是否够大?)。即使是这样,若是开发者曾经有过在浏览器下大 React 经验的话,开发 React Native 会感觉非常的熟悉,并且不会感到不适应。
它是真正的原生
关于 React Native 最为让人们称奇的第一件事就是它是&真正的&原生。其它的用于移动设备的 JavaScript 均是以某种包装后的 Web 视角封装了用户的 JavaScripts 代码。他们也许也重新实现了一些本地 UI 的行为,诸如动画之类的,但是用户写的仍然是基于 Web 的应用。
在React中,一个组件能够描述自身的外观;React 处理后再呈现给用户。一个非常清晰的抽象层将两个功能给隔离开来。为了呈现组件给 web,React 使用的是标准的 HTML 标签。这和抽象层是一个道理,即是&桥&的概念,去让 React Native 调用实际的 iOS 和 Android 呈现的 API。在 iOS 中,这意味着 React Native 组件呈现给真正的 UI 视图;在 Android 下,他们也呈现给了本地的视图。
你将写出看起来差不多就是标准的 JavaScript、CSS、HTML 代码。取代编译为本地代码,React Native 会将你的应用运行在本地平台的 JavaScript 引擎中,毋需屏蔽主要的 UI 线程。你获得了本地的性能、动画、行为,还不用去写 Object-C 或 Java。其它诸如 Cordova 或 Titanium 之类的跨平台应用开发,是无法达到如此级别的本地性能和表现的。
更好的开发者体验
相比较于 iOS 和 Android 原生的开发,React Native 提供更好的开发者体验。因为你的程序大多数都是 JavaScript,你可以从 web 开发中汲取大量的经验,比如能够立即&刷新&你的应用来查看你代码的修改。相比于在传统的应用开发中花很长的时间去等待构建的过程,会让人感觉这简直是天赐之物。
另外,React Native 还为开发者提供了智能的错误报告和标准的 JavaSript 调试工具,这些让移动开发更加的顺手。
掌控多平台
React Native 可以平滑的掌控多个平台。绝大多数的 React Native API 都是跨平台的,所以开发者只需要去写 React Native 的组件即可,它可以无缝的运行在 iOS 和 Android 下,脸书声称他们的广告管理应用跨两个平台有,还有,我自己所写的 flashcard 的代码没有任何平台有关的代码。
如果开发者打算撰写特定平台的代码,对于 iOS 和 Android 有不同的交互向导,或者干脆点说,开发者想要获得特定平台 API 的独特优势,也是很容易就可以办到的。React Native 允许开发者为每个组件指定特定平台的版本,可以随意集成到其它 React Native 的应用当中。
使用 React Native
使用单一的 JavaScript 库就想写出真正的原生的 iOS 和 Android 的应用来,无异于异想天开。那么 React Native 又是如何做到的了呢?
要开始开发 React Native 应用程序,需要为 iOS 和 Android 的开发安装一些常见的依赖,即使是 React Native。在 React Native&上有非常好的指南。设置 React Native 其实蛮简单,如果开发者已经安装了最新版的 Node.js 的话,只需要执行命令&npm install -g react-native-cli&就可以安装 React Native了。
一旦这些相关的依赖安装完成后,运行&react-native init ProjectName&,此命令会自动生成开发者开始一个项目所需要的所有样板。
这里有一点需要特别注意:开发 React Native 的话需要使用 OS X 操作系统。开发 iOS 应用,苹果公司强制要求使用 Mac,这一点对于大多数开发人员来说这个限制已经不可避免。如果开发者是专门撰写 Android 应用的话,React Native 还支持&&平台,不过目前尚处于试验阶段,开发者不妨尝试一下。
常见 React 组件
一旦准备好了开发环境,那么就可以开始撰写一些真正的应用程序了。
正如在文章前面所提到的那样,React Native 真的也只是 React,只是有少许不同罢了。React Native 的组件在浏览器中看的话和 React 的组件及其相似,但是基本的构建块已经变了。诸如&div&、&img&、&p&等标签均被替代了,React Native 提供给开发者一些诸如&Text&、&View&等基本的组件,在下面的例子中,基本的组件使用的是&ScrollView&、&TouchableHighlight、以及&Text&,所有这些都会映射到 iOS 和 Android 特定的视图,使用它们创建带有触摸控制属性的滚动视图是非常直接的:
// iOS & Android
var React = require('react-native');
var { ScrollView, TouchableHighlight, Text } = R
var TouchDemo = React.createClass({
render: function() {
&ScrollView&
&TouchableHighlight onPress={() =& console.log('pressed')}&
&Text&Proper Touch Handling&/Text&
&/TouchableHighlight&
&/ScrollView&
如果你没有处理过杂乱无章的 HTML-esque 语法以及 JSX 以前的 JavaScript 的话,这可能对你有一些困惑。React 强烈推荐开发者使用 JSX,那么基于 React Native 的话,其实没有什么可以选择的机会。你渲染的标记是和 JavaScript 所控制的行为共存的。就这一点来说常会引起新接触者强烈的反感,但是我还是强烈建议不妨一试。
因为 React Native 的组件和常见的 React 的组件极为类似,所以切换到 React Native相对是很容易的。
为了让渲染更容易、更加的有效,同样鼓励维护样式代码,React Native 实现了一个严格的 CSS 的子集。这同时也意味着开发者无需去学习特定平台的方法来从而设计视图,当然,开发者还是要花点时间去学习如何使用 React Native 的样式表的。
最大的不同就在于开发者不需要去担心特定的规则,因为样式的继承是被严重削弱过的,而且 React Native 使用的内联样式的语法。
这里是一个如何使用 React Native 来创建样式表的实例:
var styles = StyleSheet.create({
container: {
marginTop: 30
然后,此种样式是由内联语法所应用的:
&View style={styles.container}&
语法是相当的容易阅读,但是如果开发者是来自于 Web 开发的背景的话,可能会发现有些不妥。(会有一个好的理由让你继续下去的,我保证!)即进一步去阅读关于 CSS,就会发现问题,若是以 React 的方法来解决它们的话,我这里强烈推荐 Christopher Chedeau 演示文稿:。
设置移动开发环境
React Native 的其中一个比较复杂的部分就是开发环境的设置。当基于 React Native 工作时,开发者针对移动开发需要所有的通常的工具,以及 JavaScript 编辑工具:一个文本编辑器,可能还需要 Chrome 的开发者调试工具。
对于 iOS 来说,这也就意味着需要开着 Xcode,以及 iOS 模拟器。对于 Android 来说,也需要开着的有 Android Studiom、将会用到的命令行工具。最终,开发者还需要运行着的 React Native 包,当然,开发者可以自行决定使用自己喜欢的文本编辑器来编辑 JavaScript 代码。
这么做的后果就是你需要在自己的本地开好多窗口,如此之多的工具,桌面杂乱到着实让人烦恼,但是,这样的 React Native 不会隐藏任何标准的移动开发过程。
跳转到原生代码
React Native 工作在已有平台的上 API 所提供的 JavaScript 接口上。在实践中,这意味着开发者可以撰写原先自己熟悉的 React 代码,React Native 的&桥&会自动完成相关的转换,但是若转换的功能不够完善没有彻底搞定的时候该如何处理?
不可避免的是,基于诸如 React Native 这样的新框架来开发的话,总会有一些 API 是不被支持的。若发生了这样的事情,你就需要撰写&本地的模块&来提供主机平台和所开发的 JavaScript 代码之间的通信。下面是一个关于 Objective-C 模块的 &Hello,World&的简易实例:
// Objective-C
#import "RCTBridgeModule.h"
@interface MyCustomModule : NSObject &RCTBridgeModule&
@implementation MyCustomModule
RCT_EXPORT_MODULE();
// Available as NativeModules.MyCustomModule.processString
RCT_EXPORT_METHOD(processString:(NSString *)input callback:(RCTResponseSenderBlock)callback)
callback(@[[input stringByReplacingOccurrencesOfString:@"Goodbye" withString:@"Hello"]]);
然后,要使用开发者本地的 JavaScript 模块的话,和需要其它的库是一样的:
// JavaScript
var React = require('react-native');
var { NativeModules, Text } = R
var Message = React.createClass({
getInitialState() {
return { text: 'Goodbye World.' };
componentDidMount() {
NativeModules.MyCustomModule.processString(this.state.text, (text) =& {
this.setState({text});
render: function() {
&Text&{this.state.text}&/Text&
开发者这样做可能是因为所需要的 API 还没有得到支持,又或者是集成 React Native 组件到现有的 Objective-C 或 Java 代码中,又或者是需要写一些高性能的功能来处理一些密集的图形处理。非常值得庆幸的是,React Native 已经能够提供非常灵活的撰写和使用这些称之为&原生模块&,只要开发者需要,而且流程也是很顺溜的。哪怕是开发者从来没有 Objective-C 或 Java 的开发经验,撰写&桥&的代码是在和本地的移动开发相当舒服的情况下的一种很爽的体验。
部署应用程序
部署 React Native 的应用工作原理和传统的移动应用部署方式及其的类似,这并不是说这会非常的容易,众所周知,移动应用的发布流程是非常令人烦恼的。
要创建一个准备好部署的包,开发者需要使用打包好的 JavaScript 来代替在线重载的开发版本。在 iOS 中,这意味着需要在&AppDelegate.m&文件中更改一行代码,然后运行&react-native bundle --minify。对于 Android来说,开发者需要运行&./gradlew assembleRelease,在这之后,打包的流程就和原来的移动开发过程没有任何的区别了,且最终的打包结果会提交到相关的应用程序商店中。
我的 flashcard 应用在 iOS 应用商店花了两周的时间,在 Google Play 商店花了不到一天的时间。换句话说,批准的时间完全符合我的预期,即和&传统的&移动应用没有任何区别,对于 React Native 所写的程序没有作任何的处罚。
有趣的是,苹果允许应用自行更新--因此绕过了令人头疼的部署过程--如果只是更新 JavaScript的话。微软最近释出了&SDK,其允许 React Native 开发者立即更新。这是一个非常好的特性,我希望在接下来的几个月当中能够看到更多的应用程序享用此特性所带来的便捷。
结论和建议
如果你的背景是基于 web 开发的 JavaScript 工程师的话,我以为你会为 React Native 而高兴的。React Native 可以将任何背景的 web 开发者转变为潜在的移动开发者,而且对于现有的移动开发流程是得到了有效的改进。
当然,React Native 也不是完美无缺的,毕竟她还是一款较新的软件项目,要经受哪些不够成熟的程序库的折磨:有一些特性还是缺失的。而且最佳实践之类的还尚待挖掘。版本之间的变化太过于跳跃,虽然很少发生而且范围也比较有限,但还是偶尔会发生。
然而,React Native 已经足够的成熟,总而言之,好处是远远大于瑕疵的。基于 React Native,开发者可以使用单一的 JavaScript 代码库来创建 iOS 和 Android 的应用,而且还没有质量和性能上的损耗。即使开发者没有 JavaScript 的背景,也很难不被更加快速的开发周期和几乎完全的代码重用这样的好处所吸引。而且因为 React Native 允许开发者在需要的时候切换到&常见&的开发状态,你还不会受限于框架。总而言之,React Native 交付了一款高质量的、跨平台的移动开发工具,如果读者你要加入到移动开发的项目中来,你需要慎重的考虑下使用 React Native。
如果你想更进一步的阅读,我已经出版了一本专门、详细的图书:《React Native 学习》,电子版和纸版均有售卖,可以到&和上找到。你也可以在Twitter上关注我,我的账号是:,我非常期望听到大家使用 React Native 的经历以及疑问。
,本文是对React Native的技术背景、规划和风险的概述。
组里的同学于4.2完成了天猫iPad客户端&猜你喜欢&业务的React Native改造(4月中发版)。本周开始陆续放出性能/体验、稳定性、扩展性、开发效率等评估结果。
图1 - 4.2已完成React Native改造的业务
为什么需要 React Native
What we really want is the&user experience&of the&native mobile&platforms, combined with thedeveloper experience&we have when building with&React&on the web.
摘自,加粗的关键字传达了React Native的设计理念:既拥有Native的用户体验、又保留的开发效率。这个理念似乎迎合了业界普片存在的痛点,开源不到1周github star破万,目前是11000+。
React Native项目成员Tom Occhino发表的详细描述了React Native的设计理念。Occhino认为尽管Native开发成本更高,但现阶段Native仍然是必须的,因为Web的用户体验仍无法超越Native:
Native的原生控件有更好的体验;
Native有更好的手势识别;
Native有更合适的线程模型,尽管Web Worker可以解决一部分问题,但如图像解码、文本渲染仍无法多线程渲染,这影响了Web的流畅性。
Occhino没提到的还有Native能实现更丰富细腻的动画效果,归根结底是现阶段Native具有更好的人机交互体验。笔者认为这些例子是有说服力的,也是React Native出现的直接原因。
图2 - Occhino在F8分享了React Native(Keynote)
&Learn once, write anywhere&
&Learn once, write anywhere&同样出自Occhino的。因为不同Native平台上的用户体验是不同的,React Native不强求一份原生代码支持多个平台,所以不提&Write once, run anywhere&(Java),提出了&Learn once, write anywhere&。
图3 - &Learn once, write anywhere&
这张图是笔者根据理解画的一张示意图,自下而上依次是:
React:不同平台上编写基于React的代码,&Learn once, write anywhere&。
Virtual DOM:相对Browser环境下的DOM(文档对象模型)而言,Virtual DOM是DOM在内存中的一种轻量级表达方式(原话是),可以通过不同的渲染引擎生成不同平台下的UI,。
Web/iOS/Android:已实现了Web和iOS平台,。
前文多处提到的React是Facebook 2013年开源的Web开发框架,笔者在翻阅其时,发现这么一段:
图4 - 摘自React发布稿(2013)
加亮文字显示2013年已经在开发React Native的原型,现在也算是厚积薄发了。
最近另一个比较火的项目是(详见&),渲染层使用了Web Canvas来提升交互流畅性,这和上图第一个尝试类似。
React本身也是个庞大的话题不再展开,详见。
笔者认为&Write once, run anywhere&对提升效率仍然是必要的,并且和&Learn once, write anywhere&也没有冲突,我们内部正在改造已有的组件库和HybridAPI,让其适配(补齐)React Native的组件,从而写一份代码可以运行在iOS和Web上,待成熟后开源出来。
下图展示了业务和技术为React Native所做的改造:
图5 - 业务和技术改造
自下而上:
React Node:React支持服务端渲染,通常用于首屏服务端渲染;典型场景是多页列表,首屏服务端渲染翻页客户端渲染,避免首次请求页面时发起2次http请求。
React Native基础环境:
Framework集成:尽管React Native放出了文档,集成到现有复杂App中仍然会遇到很多细节问题,比如集成到天猫iPad客户端就花了组里iOS同学2天的时间。
Networking改造:主要是重新建立session,而session通常存放于http header cookie中,React Native提供的网络IO&和XMLHttpRequest不支持改写cookie。所以要不在保证安全的条件下实现fetch的扩展,要么由native负责网络IO(已有session机制)再通过HybridAPI由JS调用,暂时选择了后者。
缓存/打包方案:只要有资源从服务器端加载就避免不了这个话题,React Native也是如此,缓存用于解决资源二次访问时的加载性能,打包解决的是资源首次访问时的加载性能。
MUI是一套组件库,目前会采用向React Native组件补齐的思路进行改造。
HybridAPI是阿里一组Hybrid API,此前也在多个分享过不再累述,(),看起来更高效(未验证),改造成本不大。
最快的一个业务将于4月中上线,通过最初几个业务改造推动整体系统的改造,如果效果如预期则会启动更大规模的业务改造。
更多详细规划和进展,以及性能、稳定性、扩展性的数据随后放出。
尽管Facebook有3款App(Groups、Ads Manager、F8)使用了React Native,随着React Native大规模应用,Appstore的政策是否有变不得而知,我们只能往前走一步。
React Native Android 预计2015年10月才发布,这对希望三端(Web/iOS/Android)架构一致的用户而言也算个风险。
,如在iOS6上使用有拒审风险。
(react-native github issue)
React Native相对于Webview和Native的优势和劣势&&也给出了较详细的,可以相互参照。
阅读(...) 评论()React Native入门(2)
好久没有来更新博客了,给大家说声抱歉,人一旦懒惰起来连自己都害怕。可能是因为一个人生活,少了很多动力吧。这都是在给自己找理由。我在不偷懒了。
最近我要入坑了,公司安排我要开始搞React Native了,之前也给大家分享过一篇RN的搭建框架,那时候只是对RN感兴趣想有时间学学,但是现在要投入更多的时间。
这周领导让我给搭建分享下RN跨平台开发技术,简单的介绍一下,可是网上关于RN的技术博客很多,语言描述性的缺很少,让初学者没有一个很好的概念去全面的了解RN,所以呢我就大概总结了一下RN跨平台移动应用开发框架的介绍。
随着科技的发展,Android与iOS量大操作系统已经称霸江湖(这种稳定对开发者是一件好事,相互竞争也让两大操作系统都在不断的提升完善)。手机硬件配置越来越强大,能力越来越强大,价格越来越平易近人。手机现在已经成为了普通老百姓无时无刻不随身携带的电脑。伴随着这种趋势,市场对移动应用的需求也越来越多,而且要求越来越高。。
这么多年来,移动开发应用开发者做梦都希望有一个能跨平台的开发工具,让他们不要把同一个移动应用使用不同的开发语言写两遍。但是跨平台开发工具的实现很难,很多先驱者倒在了这条路上。直到Facebook给大家带来了React Native。
日,Facebook公司对外正式发布了React Native – 使用React框架跨平台开发原生移动应用的开源技术框架。开发者可以使用React Native 高效开发Android和iOS操作系统的应用程序。
它的设计理念是:使用React Native开发,即拥有Native的良好人机交互体验,又保留了React框架的开发效率。
(Native是指使用原生开发环境开发的应用程序。Native的良好人机交互体验是指当用户手指在屏幕上操作时,被触摸的UI组件会发生视觉上的变化)
(而React是Facebook从2012年以来慢慢发展起来的一套开发框架,在这套框架上诞生了React.js用来进行网页开发,以及React Native用来进行APP开发。《React、React.js、React native三者的关系后面具体来看》)
一次学习,随处编写
React Native提出“Learn once, write anywhere”。使用React Native可为Android和iOS两个操作系统开发应用程序,但不同平台上的代码根据平台会有细小区别,但开发思路是相同的。
React Native允许开发者在React Native擅长的领域使用React Native开发,而在React Native不能实现的领域或者已经有原生代码实现好的领域直接使用原生代码。React Native 代码开发模块与原生代码开发的模块可以双向通信、无缝衔接。
混合开发情况3种:
UI界面由React Native开发,但UI事件处理由原生代码执行。
比如登录功能,React Native开发包含用户名、密码输入以及登录按钮控件的界面,用户输入相关信息,点击登录按钮后,React Native组件将用户名和密码传给原生代码编写的登录模块(Android:java开发,iOS:Object-C或Swift开发),让原生代码执行登录操作。原生代码向服务器发送登录请求,并等待回应。在服务器回应后,原生代码将受到的回应中的登录成功与否,以及其它的一些需要向UI展示的数据传递给React Native组件,React Native接收并解析这些数据,执行UI更新,向用户展示。
将原生使用原生代码实现的UI小部件包装成React Native的自定义组件
React Native支持将Widget(官方、第三方开源、开发者自行开发)包装成React Native的自定义组件,然后在React Native代码中方便的使用。
应用界面在React Native开发的界面与原生代码开发的界面间切换
在已用原生代码开发好的项目中加入一些用React Native 开发的新界面,混合开可以做到让应用界面流畅自如地在这两种界面间切换,用户对此不会有任何的感知。
高效的UI开发
使用React Native开发移动应用的UI界面比使用原生语言快捷高效,再考虑到至少90%的移动界面都可以使用React Native开发,一分代码适配android和iOS两个平台,这相当于减掉了一个开发平台上至少50%的工作量。
React Native可以实现很多UI之外的功能,但开发UI部分绝对是React Native的强项,这体现在如下四个方面:
独特的UI实现框架
复杂UI界面开发难点的本质问题就是:如何将来自网络侧与用户侧的动态数据高效、实时、正确地呈现在复杂的用户界面上。 FaceBook的React框架是这个问题的一个优秀解决方案。React Native官网描述它的出发点为:用于开发数据不断变化的大型应用程序。相比传统的UI开发,React开辟了一个相当另类的途径,实现了UI界面的高效率、高性能开发。使用React开发,开发者永远只需要关心数据。当数据改变时,开发者只需要告诉React数据变了,有React来实现UI界面的改变。
组件化开发
React 推荐已组件的方式去重新思考UI构成,将UI上每个功能相对独立的模块定义成组件,然后将小的组件通过组合或者嵌套的方式构成大的组件,最终完成整体的UI的构建。
React强调将应用划分成多个互不相关的组件,每个组件作为独立的视图。这使得开发者更容易进行软件迭代升级,因为不用在改动某一小部分时把整个系统都梳理一遍。最重要的的是,React包装了复杂而易变的数据到对象的实现,改为提供一个声明式的结构,使得整个程序模型变得抽象而简单。使用React来构建网页或者手机UI时,代码变的更容易预测。这种可预测性使得开发者在快速迭代产品时可以更多地信任已有的代码,最终应用程序也变得更为可靠。更进一步的,React框架不仅仅使扩大应用规模变得容易,也使得团队规模更容易进行调整。
这样开发出来的代码结构清晰、公用性高、可移植性高。上一个项目的某些组件,可以很方便的拿来在下一个项目中使用;好的开源组件,可以下载后很方便地集成在我们的项目中使用。
跨平台移植代码迅速
&使用React Native进行UI开发时,开发者通常在一个平台上开发,然后用这一套代码去另一个操作系统中进行修正。通常需要修正的代码只有总代码的5%甚至更低。
自动匹配不同屏幕大小的手机
使用React Native开发,开发者无须为不同屏幕分辨率准备不同的图片资源或者布局文件,甚至可以不考虑屏幕大小的问题。通过灵活的布局方式,React Native可以做到在不同的手机屏幕上高效、清晰的UI呈现。
高效的UI调试
使用React Native开发,修改了代码后立刻可以在手机上看到效果,没有重新编译启动程序所需要的时间。并且可以打开一个Chrome窗口,所有的代码都移植到Chrome里面运行,断点调试、单步调试、调用栈追踪这些常用的调试方法都可以进行操作。
学习门槛低、开发难度低
开发语言简单
React Native使用ECMAScript 2015语言(简称ES 6)以及自创的JSX(JavaScript中加入标签化的XML)来进行开发。对于没有JavaScript知识背景的移动开发人员,只需要花时间熟悉JavaScript的基本语法后就可以使用React Native进行开发。
语法接近自然语言
React Native开发中的函数名、变量名都采用类似于自然语言的命名法,便于记忆。这种代码语句的基本含义基本可以直接推断和理解。
积木式UI开发
使用React Native开发时,是一种类似于搭积木的方式。不论是设计还是实现,通过React Native框架都能做到逻辑结构清晰、开发难度低、可读性高、后期维护方便。
开发软硬件要求低
使用ReactNative开发对软硬件要求低,RN开发用的软件都是可免费下载、安装使用的正版软件,部分是开源软件。
使用React Native开发的代价
内存消耗略大
使用React Native 开发的程序运行所需内存比原生代码开发的程序略多。
使用React Native开发的代码的运行速度比原生代码略慢。
安装包比原生代码安装包大
使用React Native开发的程序体积比原生代码大。无论是安装包的大小,还是安装后需要的空间都比原生代码编写的程序大。
8.使用RN开发的优点
1、组件化开发,复用率高,组件丰富以后,UI开发较快,前端式开发。
2、同时支持Android和iOS的UI界面。
3、可以方便的进行代码热更新。
4、Learn once,write anywhere,未来js可能会有更大的通用性,比如现在微信小程序的开发技术和React Native十分相似。现在还有用React Native开发mac桌面应用,开发web网页。
5、可以和原生页面互相调用,作为一部分嵌入到一个已有的原生app中。它是一种介于在webview和原生开发之间的解决方案,它想要实现像web一样灵活,像原生一样的性能,虽然现在还都没有达到,但是它是一种有可能接近这个目标的解决方案。
9.使用RN开发的缺点
1、由于还不是稳定版本,版本更新太快,大概两周会有一个新的版本。更新新
版可能会出现不兼容的问题,有时候需要手动解决。
2、支持的组件不全面。大部分厂商并不支持react native。一些支持的现在一般也处在不稳定版本。比如截止到rn版本0.42,js版的本地数据库组件只有realm支持,现在realm版本为3.1.0。相比较realm数据库现在是越来越稳定了。
3、程序的性能。现在普遍都说比原生的性能要差,但是差多少没有一个具体的衡量。直观的感觉是复杂的页面在一些配置较低的手机上会有肉眼可见卡顿的感觉。
4、虽然大多界面可以同时生成ios和android的,但一些涉及到底层的东西需要在ios和android单独开发,然后在js层进行调用。
5、关于react native的开发现在并没有一些best practice,也没有真正很有经验的人,很多只能摸索。对于小团队来说,试错成本有点高,一旦卡在一些问题上,网上解决方案很少,容易耽误了整体的进度。
关于RN的概念就说这么多了,我想你看完之后一定会对React Native有一个更好的认识了,接下来我会根据我自己学习RN之路的收获和遇到的困难来写更多的博客。
如果你想了解更多欢迎加入我们一起学React Native 群
来一起学习吧
参考知识库
* 以上用户言论只代表其个人观点,不代表CSDN网站的观点或立场
访问:30488次
排名:千里之外
原创:39篇
评论:54条
文章:30篇
阅读:24098
(2)(2)(1)(9)(6)(14)(1)(3)(1)

我要回帖

更多关于 reactnative 的文章

 

随机推荐