title: Navigation to the screen is too slow. It takes almost 5 seconds to open a screen
body: <p>When I try to navigate from Signin screen to the Home Screen it takes almost 5 seconds to open Home Screen. You click on the Sign in button and wait so much until it will navigate to Home. The interesting part is that only the buttons that navigate to the Home page cause this issue. I mean it happens only when you want to navigate Home Page. It seems the problem is with Home Page. Here is the code:</p>
  
  <p>Component file that will be included inside the Home Screen</p>
  
  <pre><code>const Posts = [
    {
      id: 1,
      title: "Lorem Ipsum",
      views: "260 Views",
      comments: "19 Comments",
      published: "14h ago",
      image: require("../img/img1.png"),
    },
  
  ...  
  ];
  
  const Posts = props =&gt; {
    return (
      &lt;Content&gt;
        {Posts.map((item, idx) =&gt; {
          return &lt;DataContainer {...props} key={idx} item={item} /&gt;;
        })}
      &lt;/Content&gt;
    );
  };
  
  
  
   const DataContainer = ({item, navigation}) =&gt; {
    return (
      &lt;Card style={styles.card}&gt;
        &lt;TouchableHighlight onPress={() =&gt; navigation.navigate("Post")}&gt;
          &lt;CardItem cardBody&gt;
            &lt;Image
              source={item.image}
              style={styles.img}
            &gt;
              &lt;Text
                style={styles.text}
              &gt;
                {item.title}
              &lt;/Text&gt;
            &lt;/Image&gt;
          &lt;/CardItem&gt;
        &lt;/TouchableHighlight&gt;
        &lt;CardItem&gt;
          &lt;Left&gt;
            &lt;Button transparent&gt;
              &lt;Icon
                active
                name="eye"
                style={styles.icon}
              /&gt;
              &lt;Text style={{color: '#4286f4'}}&gt;
                {item.views}
              &lt;/Text&gt;
            &lt;/Button&gt;
          &lt;/Left&gt;
          &lt;Body&gt;
            &lt;Button transparent&gt;
              &lt;Icon
                active
                name="chatbubbles"
                style={styles.icon}
              /&gt;
              &lt;Text style={{color: '#4286f4'}}&gt;
                {item.comments}
              &lt;/Text&gt;
            &lt;/Button&gt;
          &lt;/Body&gt;
          &lt;Right&gt;
            &lt;Text style={{color: '#4286f4'}}&gt;
              {item.published}
            &lt;/Text&gt;
          &lt;/Right&gt;
        &lt;/CardItem&gt;
      &lt;/Card&gt;
    );
  };
  
  export default Posts; 
  </code></pre>
  
  <p>Home Screen File </p>
  
  <pre><code>export default class HomeScreen extends React.Component {
    static navigationOptions = {
      gesturesEnabled: false,
    };
  
    render() {
      return (
        &lt;Container style={{backgroundColor: '#EEE'}}&gt;
          &lt;CommonHeader {...this.props} /&gt;
          &lt;Tabs tabBarUnderlineStyle={{backgroundColor: '#4286f4'}}&gt;
            &lt;Tab
              tabStyle={{backgroundColor: '#EEE'}}
              heading="Popular"
              activeTextStyle={{color: '#4286f4'}}
              '#EEE'Style={{backgroundColor: '#EEE'}}
              textStyle={{color: '#333333'}}
            &gt;
              &lt;Posts {...this.props} /&gt;
            &lt;/Tab&gt;
            &lt;Tab
              tabStyle={{backgroundColor: '#EEE'}}
              heading="New"
              activeTextStyle={{color: '#4286f4'}}
              Style={{backgroundColor: '#EEE'}}
              textStyle={{color:'#333333' }}
            &gt;
              &lt;Posts {...this.props} /&gt;
            &lt;/Tab&gt;       
          &lt;/Tabs&gt;
        &lt;/Container&gt;
      );
    }
  }
  </code></pre>
  
  <p>Is there missing something? Why it loads so slow?  Also it's slow on both ios and android devices but  The slowest one is on Android mobile device.</p>