本物のネイティブ作品がアンドロイドで非常に遅い

Question

「非常に遅い」というのは、これは単なる単純な例であるにもかかわらず、約5秒という単一のトランジションをロードするということです。

Here is the whole app RN code

あなたが実行しているリアクトネイティブのバージョンは何onPressFeed

Answer 1

を見てみましょうか？あなたはそれをどの携帯電話で実行していますか？

AndroidエミュレータでReact Nativeを実行するとかなり遅くなります。また、クロムデバッグをオンにしていると、アプリのロスが減ります。

私はSamsung Galaxy s4デバイスでかなり単純なReact Nativeアプリを実行していますが、かなり速く動作します（アニメーションも非常にスムーズに実行されます）。

私は（アニメーションでsidedrawerとメインビュー）を実行し、いくつかのサンプルコード：

_renderCancel: function(){ 
    if (this.state.showView) { 
    return (
     this.props.view 
    ); 
    } else { 
    return ; 
    } 
}, 

render: function() { 

var menu = <Menu 
       closeDrawer={this.closeDrawer} 
       navigator={this.props.navigator} 
       modifyOnClose={this.modifyOnClose} />; 


return (
    <Drawer 
    ref="drawer" 
    onClose={this.onClose} 
    type={this.state.drawerType} 
    animation={this.state.animation} 
    openDrawerOffset={this.state.openDrawerOffset} 
    closedDrawerOffset={this.state.closedDrawerOffset} 
    panOpenMask={this.state.panOpenMask} 
    panCloseMask={this.state.panCloseMask} 
    relativeDrag={this.state.relativeDrag} 
    panStartCompensation={this.state.panStartCompensation} 
    openDrawerThreshold={this.state.openDrawerThreshold} 
    content={menu} 
    styles={drawerStyles} 
    disabled={this.state.disabled} 
    tweenHandler={this.tweenHandler} 
    tweenDuration={this.state.tweenDuration} 
    tweenEasing={this.state.tweenEasing} 
    acceptDoubleTap={this.state.acceptDoubleTap} 
    acceptTap={this.state.acceptTap} 
    acceptPan={this.state.acceptPan} 
    changeVal={this.state.changeVal} 
    negotiatePan={false} 
    side={this.state.rightSide ? 'right' : 'left'} 
    > 
    <View> 
     <CustomToolBar onPress={this.openDrawer}/> 
     {this._renderCancel()} 
    </View> 
    </Drawer> 

); 
}, 

これは私のデバイス上でかなり迅速に実行されます。

Answer 2

これは私に多くの時間を保存：

• は「はconsole.log」のためにあなたのコードを検索し、試験前にそれらをコメント。
• は 「を、JSのDevモードを」あなたはオフにすることを確認したくなるでしょう

を「JSのDevモード」をオフにするか、そうでなければデバイス上で痛々しいほど遅い実行されます。

これは、Android上でJSのDevモードを無効にする方法である：

「反応するネイティブ実行アンドロイド」を実行した後、メニューを起動するためにお使いのデバイス を「振る」必要があります。 "Dev Settings"を選択し、 "JS Dev Mode"のチェックを外します。再びその実行「に反応ネイティブ実行アンドロイド」の後

、それはより パフォーマンスする必要があり、少なくとも私はあなたのために願っています:)

出典：私はアップグレードしたhttps://github.com/aksonov/react-native-router-flux/issues/199