title: What is memo in react?
body: <p>I am learning latest react features. As per <a href="https://scotch.io/tutorials/react-166-reactmemo-for-functional-components-rendering-control" rel="noreferrer">docks</a> memo works like <code>shouldComponentUpdate</code> or <code>PureComponent</code> in functional component but how do I use this memo concept in functional component.</p>
  
  <p>Say I have below component using class </p>
  
  <pre><code>import React, { Component } from 'react';
  class Test extends Component {
     shouldComponentUpdate(nextProps, nextState) {
       return this.props.text != nextProps.text;
     }
     render(){
       const { text } = this.props;
       return(
         &lt;div&gt;
            &lt;h1&gt;{text}&lt;/h1&gt;
         &lt;/div&gt;
       )
     }
  }
  </code></pre>
  
  <p>Functional component</p>
  
  <pre><code>function Test = props =&gt; {
    const { text } = props;
       return(
         &lt;div&gt;
            &lt;h1&gt;{text}&lt;/h1&gt;
         &lt;/div&gt;
       )
  }
  </code></pre>
  
  <p>How can I write class component using memo in functional component</p>