Remove shouldComponentUpdate policy from NavigationCard and NavigationCardStack

Summary:
The `shouldComponentUpdate` policies were meant to be a built-in optimization, but it prevents rendering at unexpected times, which has been causing confusion. Apps can use normal react optimization techniques to avoid extra rendering- Navigation will no longer attempt to optimize the render tree

Addresses https://github.com/facebook/react-native/issues/7720

Reviewed By: hedgerwang

Differential Revision: D3649735

fbshipit-source-id: 9461620445a6a57a1635113df7ec4026c0d6b9d2

Libraries/CustomComponents/NavigationExperimental/NavigationCard.js

@@ -40,7 +40,6 @@ const NavigationPagerStyleInterpolator = require('NavigationPagerStyleInterpolat
 const NavigationPointerEventsContainer = require('NavigationPointerEventsContainer');
 const NavigationPropTypes = require('NavigationPropTypes');
 const React = require('React');
-const ReactComponentWithPureRenderMixin = require('react/lib/ReactComponentWithPureRenderMixin');
 const StyleSheet = require('StyleSheet');
 const View = require('View');
 
@@ -50,11 +49,6 @@ import type  {
   NavigationSceneRendererProps,
 } from 'NavigationTypeDefinition';
 
-type SceneViewProps =  {
-  sceneRenderer: NavigationSceneRenderer,
-  sceneRendererProps: NavigationSceneRendererProps,
-};
-
 type Props = NavigationSceneRendererProps & {
   onComponentRef: (ref: any) => void,
   onNavigateBack: ?Function,
@@ -66,25 +60,6 @@ type Props = NavigationSceneRendererProps & {
 
 const {PropTypes} = React;
 
-class SceneView extends React.Component<any, SceneViewProps, any> {
-
-  static propTypes = {
-    sceneRenderer: PropTypes.func.isRequired,
-    sceneRendererProps: NavigationPropTypes.SceneRenderer,
-  };
-
-  shouldComponentUpdate(nextProps: SceneViewProps, nextState: any): boolean {
-    return (
-      nextProps.sceneRendererProps.scene.route !==
-        this.props.sceneRendererProps.scene.route
-    );
-  }
-
-  render(): ?ReactElement<any> {
-    return this.props.sceneRenderer(this.props.sceneRendererProps);
-  }
-}
-
 /**
  * Component that renders the scene as card for the <NavigationCardStack />.
  */
@@ -101,14 +76,6 @@ class NavigationCard extends React.Component<any, Props, any> {
     style: PropTypes.any,
   };
 
-  shouldComponentUpdate(nextProps: Props, nextState: any): boolean {
-    return ReactComponentWithPureRenderMixin.shouldComponentUpdate.call(
-      this,
-      nextProps,
-      nextState
-    );
-  }
-
   render(): ReactElement<any> {
     const {
       panHandlers,
@@ -135,10 +102,7 @@ class NavigationCard extends React.Component<any, Props, any> {
         pointerEvents={pointerEvents}
         ref={this.props.onComponentRef}
         style={[styles.main, viewStyle]}>
-        <SceneView
-          sceneRenderer={renderScene}
-          sceneRendererProps={props}
-        />
+        {renderScene(props)}
       </Animated.View>
     );
   }

Libraries/CustomComponents/NavigationExperimental/NavigationCardStack.js

@@ -38,7 +38,6 @@ const NavigationCardStackStyleInterpolator = require('NavigationCardStackStyleIn
 const NavigationCardStackPanResponder = require('NavigationCardStackPanResponder');
 const NavigationPropTypes = require('NavigationPropTypes');
 const React = require('React');
-const ReactComponentWithPureRenderMixin = require('react/lib/ReactComponentWithPureRenderMixin');
 const StyleSheet = require('StyleSheet');
 const View = require('View');
 
@@ -112,14 +111,6 @@ class NavigationCardStack extends React.Component<DefaultProps, Props, void> {
     this._renderScene = this._renderScene.bind(this);
   }
 
-  shouldComponentUpdate(nextProps: Object, nextState: void): boolean {
-    return ReactComponentWithPureRenderMixin.shouldComponentUpdate.call(
-      this,
-      nextProps,
-      nextState
-    );
-  }
-
   render(): ReactElement<any> {
     return (
       <NavigationTransitioner