使用redux的Tab Navigator性能问题

Question

我正在使用React native 0.50.4和react navigation 1.0.0-beta.19。我有一个性能问题。我使用Tab navigator与4个选项卡基本上每个表单（最多11个字段） 我已经将所有表单字段（全部4个选项卡）以redux状态连接起来。以便在最后一个选项卡保存时数据可用。

现在用户可以在编辑时（通过单击按钮编辑）导航到此Tab navigator，每个标签的componentDidMount。我正在派遣行动创作者，填充每个领域的状态。然后在渲染方法中填充字段值（来自mapStateToProps）。

注意：没有数据是从这里服务器获取的数据通过导航状态点击编辑按钮

性能问题是其中点击Edit button时，它需要很少的时候过去了在执行导航之前几秒钟（在真实设备上，在仿真器上没有性能问题）。我想有负荷状态componentDidMount执行所有其他调度之前启动，但仍，导航不会立即发生（这意味着它不会航行，并展示加载状态，一旦一切准备就绪，只显示）

constructor(props){ 
    super(props); 
    props.initialLoader(); // STATE HERE LOADING: TRUE 
} 

componentDidMount(){ 
if (this.props.navigation.state.params){ 
    const userData = this.props.navigation.state.params.userData; 

    this.populateOperation(userData).then(() => { 
     this.props.dismissLoader(); // LOADING: FALSE 
    }); 

} 
} 
populateOperation = (userData) => { 
    return new Promise((resolve) => { 
     resolve(
      this.props.inputChanged(userData.emailAddress), 
      this.props.addressInputChanged(userData.address), 
      this.props.addressContInputChanged(userData.addressCont), 
      this.props.cityInputChanged(userData.city), 
      this.props.stateInputChanged(userData.state), 
      this.props.postalCodeInputChanged(userData.postalCode), 
      this.props.countryInputChanged(userData.country == ''? 'Country' : userData.country), 
      this.props.phoneInputChanged(userData.phone), 
      this.props.mobilePhoneInputChanged(userData.mobile), 
      this.props.linkedInInputChanged(userData.linkedIn), 
      this.props.twitterInputChanged(userData.twitter), 
     ); 
    }); 
} 

render(){ 
    const {...} = this.props.formState; 
    return(
    <KeyboardAwareScrollView 
     style={outerContainer} 
     keyboardOpeningTime={100} 
     extraScrollHeight={5} 
    > 
    { 
     loading ? 
     ... // SHOW LOADING 
     : 
     ... // FORM 
    } 

    ); 
} 

function mapStateToProps (state){ 
    return { 
     formState: state.contactReducer 
    } 
} 

function mapDispatchToProps(dispatch){ 
    return { 
     ... 
    } 
} 

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

上面的代码是其中一个选项卡的示例。

注意：在使用终极版，性能的thunk时，是非常糟糕的，花了高达7秒也许更多浏览，切换到终极版 - 传奇之后，它变得越来越快，服用3-4秒导航 注意：标签导航器嵌套在顶层堆栈导航器中。

Answer 1

为什么调度11行动，当你可以只调度一个动作来更新商店？

每次调度都会导致潜在的重新呈现，这可能是您的性能问题的原因。