React-Native规范

1.按需导入，禁止全量导入

//bad
import _ from 'lodash';
//good
import {debounce} from 'lodash'

（按需导入需要在bebel中同步配置插件）

2.不建议redux包裹整个应用

不建议在整个应用包裹react-redux，
原因有：
1.随便一个依赖的 redux 子状态改动，可能会引起整个 Page 页面的 re-render，即使依赖这个状态的组件只占整个页面的一小部分。
2.state不合理设计可能会造成内存占用过大

3.React.Fragment 避免多层嵌套

//bad
<View>
    <ChildA />
    <ChildB />
    <ChildC />
</View>
//good
<>
    <ChildA />
    <ChildB />
    <ChildC />
</>

4.图片必须压缩

推荐tinypng.com

5.使用Image标签时，小容器加载大图的时候，应该设置 resizeMethod 为resize

可以减少android内存爆涨问题

6.require 中的图片名字必须是一个静态字符串

// 正确
<Image source={require('./my-icon.png')} />;
// 错误
const icon = this.props.active ? 'my-icon-active' : 'my-icon-inactive';
<Image source={require('./' + icon + '.png')} />;
// 正确
const icon = this.props.active
  ? require('./my-icon-active.png')
  : require('./my-icon-inactive.png');
<Image source={icon} />;

7.避免在 render 函数里创建新数组/对象

// bad 
render() {
  return <ListComponent listData={this.props.list || []}/>
}
//good
const EMPTY_ARRAY = [];
render() {
    return <ListComponent listData={this.props.list || EMPTY_ARRAY}/>
}

8.合理使用setNativeProps

在（不得不）频繁刷新而又遇到了性能瓶颈的时候，使用setNativeProps代替state和props

9.合理使用Interactionmanager

将一些耗时较长的工作安排到所有互动或动画完成之后再进行。这样可以保证 JavaScript 动画的流畅运行

10.合理使用ScrollView，VirtualizedList，FlatList，SectionList

11.FlatList 的 getItemLayout 属性合理使用

不确定高度，千万别设置 getItemLayout 属性，会出现出现页面跳动

12.禁止使用json文件存储大量数据在本地使用

不能超过1KB，应该考虑使用接口，在rn中对js的加载解析特别慢，应当珍惜每一点空间

13.应当统一把图片放在一个目录，而不是每个页面一个图片目录

为什么？因为在项目中会有大量的重复图片文件，分散开不易管理

14.ScrollView禁止嵌套

两个可以滚动的页面嵌套, 在移动端是只能执行一个的