title: using State to get the input value while text is changing. if then, while text is chaing, all will rerender again. does this make the app very slow?
body: <p>while I am working on react app, I have very basic, but very important question.
  as I am seeing the <a href="https://reactjs.org/docs/forms.html" rel="nofollow noreferrer">https://reactjs.org/docs/forms.html</a>, it is using State to get the input value like the following.</p>
  <pre><code>const App = () =&gt; {
  
      const [text, setText] = React.useState('');
  
      const handleText = (event) =&gt; {
          setText(event.target.value);
      };
  
      const list = [
          // 1000 items
      ]
  
      return (
          &lt;&gt;
              &lt;input type=&quot;text&quot; value={text} onChange={handleText} /&gt;
              {list.map((item) =&gt; (
                  &lt;ListItem key={item.id} item={item} /&gt;
              ))}
          &lt;/&gt;
      );
  };
  </code></pre>
  <p>Here, I have a question.
  whenever the user is typing on input control, text state will change. the everything will render again.</p>
  <p>as you see my example code, the component is displaying the 1000 items.
  this means ... whenever the user is typing on input control, the component is displaying the 1000 items, again.</p>
  <p>if then, I think that this is very expensive.</p>
  <p>current my solution is for fixing this issue. I am going to use React.memo like the following.</p>
  <pre><code>const ListItemMemo = React.memo(ListItem);
  
  const App = () =&gt; {
  
      const [text, setText] = React.useState('');
  
      const handleText = (event) =&gt; {
          setText(event.target.value);
      };
  
      const list = [
          // 1000 items
      ]
  
      return (
          &lt;&gt;
              &lt;input type=&quot;text&quot; value={text} onChange={handleText} /&gt;
              {list.map((item) =&gt; (
                  &lt;ListItemMemo key={item.id} item={item} /&gt;
              ))}
          &lt;/&gt;
      );
  };
  </code></pre>
  <p>on this status, I have 2 questions.</p>
  <ol>
  <li>is my React.Memo solution the best?</li>
  <li>is there any other way to get the input value when it is changing for high performance?</li>
  </ol>
  <p>Regards</p>