title: Why is React.memo not working as expected?
body: <p>Right so I have a sports app and im just displaying the fixtures for each team like so:</p>
  <pre><code>export const Fixtures = ({ fixtures }) =&gt; {
          console.log('rendering again')
          return (
              &lt;View&gt;
                  &lt;Text style={{ fontSize: 17, alignSelf: 'center', fontWeight: '700', marginBottom: 10 }}&gt;
                      Gameweek Fixtures
                  &lt;/Text&gt;
                  &lt;View style={styles.container}&gt;
                      &lt;View&gt;
                          {fixtures.map((match: any) =&gt; (
                              &lt;View key={match.home} style={styles.match}&gt;
                              // displaying fixtures here
                              &lt;/View&gt;
                          ))}
                      &lt;/View&gt;
                  &lt;/View&gt;
              &lt;/View&gt;
          )
      }
  </code></pre>
  <p>I'm displaying the images for the logo for each team above and I was noticing a flicker and when ever this component renders. and it renders in a top nav view. i.e. I click on the fixtures in the navbar and it shows this component.</p>
  <p>I don't like the flicker so I'm trying to make it more performant and decided to use react.memo</p>
  <p>I wrapped the above in React.memo like so:</p>
  <pre><code>export const Fixtures = React.memo(({ fixtures }) =&gt; {
          console.log('rendering again')
          return (
              &lt;View&gt;
                  &lt;Text style={{ fontSize: 17, alignSelf: 'center', fontWeight: '700', marginBottom: 10 }}&gt;
                      Gameweek Fixtures
                  &lt;/Text&gt;
                  &lt;View style={styles.container}&gt;
                      &lt;View&gt;
                          {fixtures.map((match: any) =&gt; (
                              &lt;View key={match.home} style={styles.match}&gt;
                              // displaying fixtures here
                              &lt;/View&gt;
                          ))}
                      &lt;/View&gt;
                  &lt;/View&gt;
              &lt;/View&gt;
          )
      },
  (prevProps, nextProps) =&gt; {
      console.log(prevProps, nextProps, 'the propss')
      return true // props are not equal -&gt; update the component)
  })
  </code></pre>
  <p>but for some reason it is not logging the console.log when the component renders but it does log the line at the top that says: <code>console.log('rendering again')</code>.</p>
  <p>why is it not logging? and what can i do to prevent this flicker on every render? I just want to display the fixtures, instead it flashes, flickers then shows them (might be ok on first render for this but not on every subsequent one)</p>