React Native开发技术周报Issue#15
尊重版权,未经授权不得转载出处:http://www.lcode.org
本周报来自江清清的技术专栏,欢迎微信关注公共号:codedev123.精彩技术文章第一时间推送!
说在前面的话:React Native开发技术周报,主要会涉及React Native最新资讯,React Native教程,技术开发文章,开源项目,工具,视频等等。今天是我们的第十五期,同时各位朋友有优秀的有关React Native技术开发文章可以发给我。
React Native交流7群:131537844
(一).资讯
该电子书不错,虽然是英文的,整理来讲简明意赅的感觉。
性能优化,干货推荐。
(二).技术文章
1.React Native进阶之Animated动画库详解-实例篇
Animated动画在用户体验中是非常重要的一部分,Animated库可以用来构建流畅,强大,并且容易构建以及可维护的动画。本篇主要讲解Animated动画库的基本使用。
2.React Native模块之InteractionManager(交互管理器)详解
使用InteractionManager可以让一些耗时的任务在交互操作或者动画完成之后进行执行,这样使用可以保证我们的JavaScript的动画效果可以平滑流畅的执行。可以大大提升用户体验。
3.React Native模块之Timers(定时器)详解
Timers(定时器)是应用中非常重要的部分,在React Native中实现和浏览器一致的Timers。
在这篇文章里,我会实现一个可重用的函数来处理 JavaScript 延时异步操作。
5.React-Native For Android 环境搭建及踩坑
6.ReactNative iOS源码解析(一)
绝对干货,分析了React Native iOS部分框架的初始化流程以及OC和JS的相互调用原理分析
7.你想知道的关于JavaScript作用域的一切(译)
JavaScript中有许多章节是关于scope的,但是对于初学者来说(甚至是一些有经验的JavaScript开发者),这些有关作用域的章节既不直接也不容易理解. 这篇文章的目的就是为了帮助那些想更深一步学习了解JavaScript作用域的开发者,尤其是当他们听到一些关于作用域的单词的时候, 好比:作用域(scope),闭包(closure),this,命名空间(namespace),函数作用域(function scope),全局作用域(global scope),词法作用域(lexical),公有变量(public scope),私有变量(private scope). 希望通过这篇文章你能够理解。
针对ES2015的知识体系做了集中整理分享,非常不错,超级赞。
10.在React Native中优雅的使用iconfont
关于在React Native中使用iconfont,网上已有很多非常好的解决方案,用的最多的就是react-native-vector-icons , 这个库支持很多常用的iconfont,比如FontAwesome, Ionicons, MaterialIcons等等。但是这个库依赖了不少iOS和Android的原生代码,这让一个前端开发脸上浮现了一个大大的懵逼。 而且自带的字体文件都偏大,做起精简来简直想哭,更别说加入自定义的iconfont了。所以本文给大家介绍如何以非常优雅的姿势进行使用iconfont库。
widgets应该是android平台上最有用的特性之一了吧,将应用的数据利用一个小视图嵌入其他应用(如桌面),可以快速地获得app的状态而不用启动app。本问主要讲解这个知识点。
这本书我会由简单到复杂的带领大家进入 React 的世界, 其中 1 – 3 章节都是 React 的基础知识,需要提醒读者的是大多数的基础知识都可以通过 React 的官方文档学习,如果对英语敏感的读者也可以看翻译。 对比官方文档本书 1 – 3 章会循序渐进的带领大家学习 React 基础知识,其中会有些自己的见解和领悟希望能让读者更容易理解学习,每个章节都会有一个实例作业。
13.【React Native for Android】jsBridge实现原理
本文虽然讲的内容不多,但是精益求精了,图文并茂。
14.React Native系列文章(十)react-native-scrollable-tab-view(入门篇)
15.React Native系列文章(十一)react-native-scrollable-tab-view(进阶篇)
通用的Tab标签器,非常不错哦~非常赞。
16.React Native 封装Android 原生View实例
实例讲解封装原生View控件。
17.React Native开发之动画(Animations)
本文主要讲解动画的基本使用。
18.react-native动态修改server host
大家都知道android端的react native可以运行时修改server host,开发模式下摇一摇设备,呼出调试菜单,就可以修改server host,不需要重新打包很方便。不知道为什么,iOS环境却没有提供相关功能。于是这个工具就出来了:react-native-debug-server-host。我们知道直接修改源码很容易实现需求,但不侵入原有代码才是上策,后面部分有实现原理的简单介绍。
React本身就非常关注性能,其提供的虚拟DOM搭配上Diff算法,实现对DOM操作最小粒度的改变也是非常的高效。然而其组件渲染机制,也决定了在对组件进行更新时还可以进行更细致的优化。
(三).开源项目
一个在F8基础上照猫画虎的漫威React Native App. 支持Android和IOS。 想要自己运行app的话,到http://developer.marvel.com/ 上申请API key,添加到env.js中。主要功能点:显示流行的漫威角色,搜索漫威character, event, story, series,Android,iOS双平台支持
2.React Naitve开发的Cool zjapp客户端
这一个RN的练习项目,包含了许多功能点以及第三方库的使用,在开发中或多或少会用到,与君共勉。功能:1 自定义封装了类知乎客户端的tabbar,并且伴随滚动逐渐隐藏和显示头部底部功能。2 实现本地通讯录的交互(用的是ScrollView数据多可能会卡顿)3 拍摄或者选择图片剪切头像(react-native-image-picker 有些bug)4 获取本地图片 实现自定义相册功能(全部获取所有图片,对数其进行分类可以实现分类相册功能)5 MD设计风格的第三方库(react-native-material-kit)
3.React Native一些实例Demo整理-有一些非常有特点的库使用
(四).工具
将babel捧作前端一个划时代的工具一定也不为过,它的出现让许多程序员幸福地用上了es6新语法。但你就这么放心地让babel跑在外网?反正我是不放心,我就曾经过被坑过,于是萌生了研究babel代码转换的想法。本文不是分析babel源码,仅仅是看看babel转换的最终产物。
es6在babel中又称为es2015。由于es2015语法众多,本文仅挑选了较为常用的一些语法点,而且主要是分析babel-preset-2015这个插件(react开发的时候,常在webpack中用到这个preset)。
2.我的 React Native 技能树点亮计划 の 代码风格统一工具 EditorConfig
EditorConfig 通过在工程中增加一个配置文件以及安装对应的插件,实现在不同编辑器和 IDE 保持工程中代码文件编码格式的一致性,EditorConfig 的配置文件具有良好的可读性,并能很好的和版本控制系统一起协作。