首页 » React Native » React Native技术周报 » 正文

React Native开发技术周报Issue#22-重点神器Storybook和Expo推荐

尊重版权,未经授权不得转载出处:http://www.lcode.org

本周报来自江清清的技术专栏,欢迎微信关注公共号:codedev123.精彩技术文章第一时间推送!

说在前面的话:React Native开发技术周报,主要会涉及React Native最新资讯,React Native教程,技术开发文章,开源项目,工具,视频等等。今天是我们的第二十二期,同时各位朋友有优秀的有关React Native技术开发文章可以发给我。

React Native交流10群:157867561,欢迎各位大牛,React Native技术爱好者加入交流!同时博客右侧欢迎微信扫描关注订阅号,移动技术干货,精彩文章技术推送!

(一).资讯

1.React Native 0.4_RC版本更新啦,具体更新信息介绍,附中文版本内容:

内容简介: Facebool/Marno 1.1.正式放出来FlatList组件,列表性能终于变强了;1.2.添加支持 alignContent 属性; 1.3.支持将自定义的模板工程上传到 npm;另外还有修复了双平台上面很多的BUG,以及新增的很多特性。

(二).技术文章

1.从ES5语法到ES6语法你应该知道这些

内容简介:程序员杜鹏程  比较旧的RN项目基本使用ES5进行开发的,不过现在随着ES6的流行,许多公司基本都用ES6语法来开发RN了,所以当一个刚接触RN,对JS又不是很厉害的同学来说,要看懂别人的代码就要先知道ES5和ES6的区别有哪些,当我们遇到ES5语法写的RN项目时,我们怎么把他很好的理解成ES6语法的项目,话不多说,我们直接来学习吧。

2.使用redux thunk 回顾

内容简介:kaziii  作者最近在使用React构建一个webChatApp的项目使用了Redux,其中异步请求与websocket请求我都是使用redux-thunk这个facebook官方推荐的中间件来处理大部分的业务。本文作为redux thunk的使用总结回顾。

3.React-Native 热更新以及增量更新

内容简介:臃肿的林某某 简单给大家演示怎么实现RN的热更新方法。

4.JavaScript高级计时器

内容简介: JavaScript的定时器不是线程,JavaScript是运行于单线程的环境中的,而定时器仅仅只是计划代码在未来的某个时间执行。

5.React Native 详细实现热部署、增量差异化热更新

内容简介:Songlcy Android原生App中我们实现热修复有很多种选择:Tinker、hotFix、Qzone的热更新等等。基本的思路都是大同小异的。React Native中的热更新有点像App的版本更新,也就是根据查询server端的版本和手机端目前App的版本进行对比,然后来执行是否更新的操作。根本原因在于React Native的加载启动机制:React Native会将一系列资源打包成js bundle文件,系统加载js bundle文件,解析并渲染。所以,React Native热更新的根本原理就是更换js bundle文件,并重新加载,新的内容就完美的展示出来了。微软为我们提供了CodePush来简化热更新的操作,但是由于速度等原因在国内并没有备受青睐。本篇内容就以自己服务器来更新的方式实现。

6.React Native Image Cache(图片缓存库模块)详解(一)

7.译|React Native中的图片缓存详解(二)

8.React Native ListView中图片加载优化处理(三)

内容简介:以上三篇主要讲解了React Native图片缓存库。

9.React Native性能优化

内容简介:ShunQ_Wang 作者讲解了React Native中几大性能优化注意点,例如:优化Component,方法创建优化,善于使用shouldComponentUpdate,listview代替scrollview,使用InteractionManager等等

10. React Native 技术 开发跨平台 Native App 初探

内容简介:郭朝 本文记录作者初次接触React Native基本一些情况,其中记录Native,Hybird,React Native等几种开发方法对比,RN环境搭建以及常用的一些开发库和参考开源项目。

11.React-Native 开发(二) 在react-native 中 运用 redux

内容简介:程序媛_Mickey 简单讲解如何在React Native中使用redux库

12.React Native 之 数据持久化

内容简介:雨泽Forest  数据持久化一直都是软件开发中重要的一个环节,几乎所有的应用都具备这一项功能;那什么是数据持久化呢?—— 说白了就是数据的本地化存储,将数据存储到本地,在需要的时候进行调用。这边我们介绍两种在 React-Native 中比较常用的存储方式AsyncStorage:这是官方使用的存储方式,类似于 iOS 中的 NSUserDefault ,区别在于,AsyncStorage 只能存储 字符串键值对,而 NSUserDefault 可以存储 字符串和number。Realm:今天才发现 Realm 也已经支持 React-Native ,这是新兴的移动端数据存储方式,在没有它之前,一直都是使用 sqlist 进行数据存储,在性能上,各有优势,但是操作上,Realm 有着明显优势,更方便使用。

13.Flux与Redux背后的设计思想(一):Command Bus, Event Bus, Service Bus 

内容简介:前端技术漫游指南 本文主要介绍Flux架构和Redux架构背后的设计思想。

14.构建一套适合 React、ES6 开发的脚手架

内容简介:ZengTianShengZ  Webpack 是当下最热门的前端资源模块化管理和打包工具。它可以将许多松散的模块按照依赖和规则打包成符合生产环境部署的前端资源。 还可以将按需加载的模块进行代码分隔,等到实际需要的时候再异步加载。通过 loader 的转换,任何形式的资源都可以视作模块,比如 CommonJs 模块、 AMD 模块、 ES6 模块、CSS、图片、 JSON、Coffeescript、 LESS 等。

15. Redux 的设计思想

内容简介:ZengTianShengZ  Redux是什么呢?一个状态管理工具。那是干嘛用的呢?都知道,React可以进行单页应用的开发,可以对页面 中各个模块进行分割形成组件,而组件之间就避免不了事件的传递或数据的交互,那Redux就是用来对这些组件 的状态进行管理的。就好比买家和卖家,快递是交给第三方(Redux)去完成。

16.20分钟理解React Native For Android原理

内容简介:公司内几个 APP 已经接入并上线了多个 RN 模块,后续规划的定制化需求及性能优化需要我们对 RN 底层原理有更深入的理解。下面通过研读源代码来分析和总结下 Android 中的 RN 实现原理。

17.如何做一个RN容器-iOS

18.理解Promise简单实现的背后原理

内容简介:HJM 写javascript时我们往往离不开异步操作,过去我们往往通过回调函数多层嵌套来解决后一个异步操作依赖前一个异步操作,然后为了解决回调地域的痛点,出现了一些解决方案比如事件订阅/发布的、事件监听的方式,再后来出现了Promise、Generator、async/await等的异步解决方案。co模块使用了Promise自动执行Generator,async/await这个Node7.6开始默认支持的最新解决方案也是依赖于Promise,所以了解Promise是非常有必要的,而理解它背后的实现原理则能在使用它的时候更加游刃有余。

19.React Native APP页面导航模式设计

内容简介:plusmancn 微信的导航模式主要有:首页底部的横向 TabBar 导航 + 纵向的 Navigator 弹出式导航.我们先来实现 TabBar 导航。

(三).开源项目

1.直接用于React Native开发各种加密标准的JavaScript库(MD5,AES,DES,SHA...)

内容简介: brix 推荐一款前端加密库,直接安装就即可在React Native上面进行使用。常用的MD5,AES,SHA等等一系列的加密方法都已经封装好了。

2.一个基于 react-native + mobx + socket.io + node 的仿微信 JS-Wechat

内容简介:一个正在开发中的React Native版本仿照微信的IM即时通信APP

(四).工具

1.使用Enzyme测试React(Native)组件

内容简介:吕靖  在组件化出现之前,我们不谈UI的单元测试,哪怕是对于UI页面进行测试都是一件非常困难的事情。其实组件化并不完全是为了复用,很多情况下也恰恰是为了分治,使得我们可以分组件对UI页面进行开发,然后分别对其进行单元测试。特别是当浏览器中的Web应用越来越庞大的时候,与在后端将大型单体应用拆分成微服务架构的最佳实践一样,前端应用也可以被拆分成不同的页面和特性。

2.React Native Storybook神器工具

内容简介:通过该Storybook神器,我们可以不需要运行APP就可以设计开发RN的组件

3.Expo工具

内容简介:Expo是一个移动端APP开发套件,它可以让我们采用JavaScript进行开发高质量的iOS和Android应用。通过Expo开发React Native的时候,我们不需要打开xcode和android stduio甚至也许不要写任何原生代码。

关注我的订阅号(codedev123),每天推送分享移动开发技术(Android/iOS),React Native技术文章,项目管理,程序猿日常点滴以及精品技术资讯文章(欢迎关注,精彩第一时间推送)。