使用React Native一年后的感受
转载自;http://www.dobest.me/blog/2016/06/12/%E4%BD%BF%E7%94%A8React%20Native%E4%B8%80%E5%B9%B4%E5%90%8E%E7%9A%84%E6%84%9F%E5%8F%97/
当我在面试Discord的时候,技术主管Stanislav跟我说:
React Native代表着未来。等它一发布,我们就会用它从零构建iOS应用。
作为一名原生iOS开发者,基于先前使用PhoneGap的经验,我非常怀疑使用Web技术构建移动应用的这种方式。但是当我学习并使用React Native一段时间之后,我非常庆幸我们做了这个决定。
开发效率
虽然iOS“团队”只有我自己一个人,但是iOS应用开发依然可以赶上Web和桌面应用开发闪电般的速度。Apple公司已经允许开发者使用JavaScriptCore
进行应用的升级,而无需等待App Store的审核流程。这对于那些缺乏专业的iOS QA(质量保障)团队的小公司来说是非常便利的,因为iOS团队可以在发布新功能之后进行热更新。
使用React Native一年之后,我们的iOS开发周期明显变快了,这得益于很高的开发效率。比如:
基于现有的前端架构,我们在两周之内就发布了V1.0的版本。
相比于
Auto Layout
,基于Flexbox的样式可以节省一半的代码,并且更容易理解。使用Flux设计模式,iOS和Web应用共享了
store
和action
的98%的代码。
性能
React Native在后台线程运行JavaScript并发送极小的代码到主线程中。事实证明,React Native相比于Objective-C或Swift编写的原生iOS应用来说有一些性能差异!
Reactiflux小组的性能演示,该组有超过1.1万个会员 —— UI和JS线程大多数都是60FPS
然而,我们当初开始构建iOS应用时发现聊天滚动视图的性能并不令人满意,尤其是一些活跃的聊天分组。于是,我们决定使用ComponentKit构建聊天视图并编写必要的桥接代码代替原有的方案。当JS线程在完成一些繁重任务的时候,类库也无法提供原生那样流畅的动画(译注:之前动画是在JS线程执行,目前有人提交了一份代码,有望使用原生iOS动画接口),因此我们在抽屉侧滑动画上继续使用PopAnimation。
注: 作者称该应用仅聊天视图和抽屉动画是原生代码实现的,其他均由React Native实现。
当React Native Android版本发布时,我们也尝试在Android设备上运行应用,但遗憾的是,我们遇到了一些性能问题,只好暂时放弃。Android开发主管Miguel是这样说的:
可用性
React Native让开发工作更简洁,使得开发者可以专注于每个新版本核心功能的开发。应用内自带的开发者菜单为我节省了大量的时间。
其中我最喜欢的一个功能是Show Inspector
(审查工具),它可以即时展现交互视图的层级结构以及被选组件中所有必要的样式信息,这无疑是我用过的最棒的iOS审查工具。
社区
React Native项目每两周会发布一个新版本,其中包含一些新的特性以及修复的bug。这有利有弊,好比iOS几个月的稳定版本的发布,新的代码需要额外的时间进行升级,尤其是生产环境中的应用。因此,这也是到目前为止我们fork的React Native仓库只有四次主要升级的原因。
由于React Native还不太成熟,资源有限,也不完整。但随着它越来越流行,在不久之后一定能赶上其他成熟的技术。下面列出了一些实用的资源,我也经常在它的仓库上提问和获取最新的信息:
Reactiflux上的#react-native。
js.coach—React Native开源组件列表。
awesome-react-native—大量的React Native文章、教程和示例。
译注:中文资源:React Native学习指南
总的来说,React Native很有潜力,它把我们团队的移动应用开发带上了一个新的台阶。像我这样原生的iOS开发者可以平滑地过渡到React Native,这有些出乎我的意料。同时,它也帮助我扩展职业技能,因为我也可以很轻松地向React编写的Web应用贡献代码了。
使用React Native一年后的感受的更多相关文章
- React Native初探
前言 很久之前就想研究React Native了,但是一直没有落地的机会,我一直认为一个技术要有落地的场景才有研究的意义,刚好最近迎来了新的APP,在可控的范围内,我们可以在上面做任何想做的事情. P ...
- React Native指南汇集了各类react-native学习资源、开源App和组件
来自:https://github.com/ele828/react-native-guide React Native指南汇集了各类react-native学习资源.开源App和组件 React-N ...
- React Native 常用学习链接地址
Android Studio下载http://www.android-studio.org/ 第二章:Android Studio概述(一)http://ask.android-studio.org/ ...
- React Native入门指南
转载自:http://www.jianshu.com/p/b88944250b25 前言 React Native 诞生于 2015 年,名副其实的富二代,主要使命是为父出征,与 Apple 和 Go ...
- 写给移动开发者的 React Native 指南
本文原创版权归 简书 wingjay 所有,如有转载,请于文章篇头位置显示标注原创作者及出处,以示尊重! 作者:wingjay 出处:http://www.jianshu.com/p/b8894425 ...
- windows 7下React Native环境配置
React Native 是 Facebook 推出的一个用 Java 语言就能同时编写 ios,android,以及后台的一项技术,它可以做到实时热更新 .FaceBook 也号称这们技术是 “Le ...
- React Native:使用 JavaScript 构建原生应用
[转载] 本篇为联合翻译,译者:寸志,范洪春,kmokidd,姜天意 数月前,Facebook 对外宣布了正在开发的 React Native 框架,这个框架允许你使用 JavaScript 开发原生 ...
- React Native Changed the World? or Nothing.
RN是一个awesome的技术, facebook很有想法的团队创造出一项新的技术改变了native开发界. 但是RN本身又疑点重重, RN是为了解决什么问题而存在的? 在诞生了一年后, RN又解决了 ...
- React Native开发技术周报2
(1).资讯 1.React Native 0.22_rc版本发布 添加了热自动重载功能 (2).技术文章 1.用 React Native 设计的第一个 iOS 应用 我们想为用户设计一款移动端的应 ...
随机推荐
- 一、链接Sql Server2014提示找不到实例的问题解决方案
在登录数据库时,确认数据库地址.用户名.密码正确的情况下,却报如下错误,则说明目标数据库服务器有相应的服务未启动. 在目标数据库服务器中打开服务列表: 找到SQL Server(****)服务(括号中 ...
- SecureCRT 7.3.4破解版(含注册机)
不用说你肯定知道SecureCRT用途是什么,这个号称最好用的ssh连接工具却不是免费的,所以找了很久才找到最新版本的SecureCRT 7.3.4破解版,其实只要是SecureCRT 7.3.x版本 ...
- WebService 调用三种方法
//来源:http://www.cnblogs.com/eagle1986/archive/2012/09/03/2669699.html 最近做一个项目,由于是在别人框架里开发app,导致了很多限制 ...
- A - 小彭玉的扫荡食堂计划
A - 小彭玉的扫荡食堂计划 Time Limit: 20000/10000MS (Java/Others) Memory Limit: 128000/64000KB (Java/Others) ...
- SQL Server服务开闭
SQL Server(MSSQLSERVER)是必须要开启的,这个是数据库引擎服务,就像汽车的发动机一样. SQL Server代理(MSSQLSERVER)是代理服务,比如你有一些自动运行的,定时作 ...
- Brackets + Sass 学习心得
大家知道Brackets是一个可以实时浏览html页面修改效果的工具,对于前段开发人员应该不会陌生,有了它,布局页面再也不是什么困难了, 目前为止已经更新到1.6了. 下载最新版可以到官方网: htt ...
- CSS的标签类型
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8" ...
- error while loading shared libraries: libseaudit.so.4: cannot open shared object file: Error 40
安装共享库后要注意共享库路径设置问题, 如下: 1) 如果共享库文件安装到了/lib或/usr/lib目录下, 那么需执行一下ldconfig命令 ldconfig命令的用途, 主要是在默认搜寻目录( ...
- wordpress建站过程4——index.php
<?php get_header(); ?> <div id="primary" class="content-area col-md-9"& ...
- nodejs【伪】入门教程
声明: 本文适合白的不能再白的小白 不要被标题误导,本文不会讲nodejs基础,只是本人学习流程和资料的一个整合 如果想找一大堆教程自己看,没有电梯,自己拉到文章最下方吧 一.nodejs是什么 ...