react-native-tab-navigator和redux性能问题

Question

我使用react-native-navigation-redux-helpers将react-native-tab-navigator连接到redux reducer。当我按下选项卡时，reducer会更改redux存储区内的当前选项卡状态。但是，当我点击标签和标签被选中时，存在延迟。并呈现组件。有没有办法加快选择标签和渲染视图的过程？

这是我的ApplicationTabs组件：

import React, { Component } from 'react';
import { connect } from 'react-redux';
import { actions as navigationActions } from 'react-native-navigation-redux-helpers';
import { Tabs, Tab, Icon } from 'react-native-elements';
import Feed from '../feed';
import Inbox from '../inbox';
import { openDrawer } from '../../actions/drawer';
import styles from './styles.js';

const { jumpTo } = navigationActions;

class ApplicationTabs extends Component {
  constructor(props) {
    super(props)
  }

  _openDrawer() {
    this.props.openDrawer();
  }

  _renderTabContent(tab) {
    switch (tab.key) {
      case 'feed':
        return <Feed />;
      case 'request':
        return <Inbox />
      default:
        return <Feed />;
    }
  }

  _changeTab (tab) {
    const { tabs } = this.props;
    this.props.jumpTo(tab.key, tabs.key)
  }

  render() {
    const { tabs, drawerState } = this.props;
    const children = tabs.routes.map((tab, i) => {
      return (
        <Tab
          selected={tabs.index === i}
          title={tab.title}
          renderIcon={() => <Icon containerStyle={styles.iconContainer} iconStyle={styles.iconStyle} type='Entypo' name={tab.iconName} size={33} />}
          onPress={() => this._changeTab(tab)}
          titleStyle={styles.titleStyle}>
          {this._renderTabContent(tab)}
        </Tab>
      )
    });
    return (
      <Tabs tabBarStyle={styles.tabBarStyle}>
        <Tab
          selected={drawerState === 'opened'}
          title='Menu'
          renderIcon={() => <Icon containerStyle={styles.iconContainer} iconStyle={styles.iconStyle} type='Entypo' name='menu' size={33} />}
          onPress={() => this._openDrawer()}
          titleStyle={styles.titleStyle}>{this._renderTabContent(tabs.key)}</Tab>
        {children}
      </Tabs>
    );
  }
}

function mapDispatchToProps(dispatch) {
  return {
    jumpTo: (keyOrIndex, key) => dispatch(jumpTo(keyOrIndex, key)),
    openDrawer: () => dispatch(openDrawer()),
  };
}

function mapStateToProps(state) {
  return {
    tabs: state.tabs,
    drawerState: state.drawer.drawerState
  }
}


export default connect(mapStateToProps, mapDispatchToProps)(ApplicationTabs);

这是tabReducer：

import { tabReducer } from 'react-native-navigation-redux-helpers';

const tabs = {
  routes: [
    { key: 'feed', title: 'Feed', iconName:'home'},
    { key: 'request', title: 'Request', iconName: 'camera-alt' },
    { key: 'memoryBox', title: 'Memory Box', iconName: 'photo' },
    { key: 'search', title: 'Search', iconName: 'search' }
  ],
  key: 'ApplicationTabs',
  index: 0
};

export default tabReducer(tabs);