title: React state really slow on a text input
body: <p>I have a text input which looks like this:</p>
  <pre><code>&lt;input
      placeholder=&quot;Search by City, Zip Code, or Name&quot;
      type=&quot;text&quot;
      className=&quot;searchBar&quot;
      value={this.state.search}
      onChange={(e) =&gt; this.setState({ search: e.target.value })}
      onKeyDown={this.keySearch}
  &gt;&lt;/input&gt;
  </code></pre>
  <p>My problem here is let's say I type the word hello. Only after 5 seconds does it show up, and each type I type a letter it takes 5 seconds to show up in the text input. It should be instantaneous.</p>
  <p>This is not a browser or computer problem.</p>
  <p>On another page on my website a have a text input written similarly to the one above, and it is perfectly fine.</p>
  <p>Is this because I have so much state in my constructor?</p>
  <pre><code>constructor(props) {
      super(props);
      this.state = {
        shops: [],
        burger: &quot;0&quot;,
        pointerEvents: &quot;none&quot;,
        width: &quot;30px&quot;,
        logout: &quot;none&quot;,
        login: &quot;flex&quot;,
        loadingMAP: true,
        search: &quot;&quot;,
        modal: true,
        addresses: [],
        currentPosition: {},
        userLocation: { lat: 39.0119, lng: -98.4842 },
        zoom: 4,
        loadingMAP2: &quot;block&quot;,
        dashboard: &quot;none&quot;,
        FetchingData: &quot;block&quot;,
        showMap: &quot;flex&quot;,
        gridlistDisplay: &quot;flex&quot;,
        showmaptext: &quot;Show map&quot;,
        MapBoxDisplay: &quot;block&quot;,
        loadingShopBusinesses: &quot;none&quot;,
        shopbusinessesmapbox: [],
        count: 0,
      };
    }
  </code></pre>
  <p>Or is this another problem?</p>
  <p>Please help and thanks.</p>
  <p>My full code:</p>
  <p><a href="https://gist.github.com/rherugu/510fabd4dd89da080a843f61ec1881e0" rel="nofollow noreferrer">https://gist.github.com/rherugu/510fabd4dd89da080a843f61ec1881e0</a></p>