title: Storing data locally for an autocomplete/typeahead field
body: <p>I'm building a web app (in React on the client-side and backed by a Rails server API) with an autocomplete/typeahead input field. I want to store the data for this field locally (on the client) because:</p>
  
  <ol>
  <li>I want the response when the user is typing to be instant. This is important because it is essentially a data-entry app with this process being repeated many times. This also means that the data is going to be reused again and again.</li>
  <li>The data is static, it doesn't change (except maybe once every 1-2 years when a new dataset comes out).</li>
  </ol>
  
  <p>The data consists of ~2600 objects, each with a little bit of associated data. In total the generated JSON array currently works out to be about 420 KB in size.</p>
  
  <p>My question is: <strong>what is the best strategy for storing this data in a reasonably persistent manner on the client side?</strong></p>
  
  <ul>
  <li><p>Should it live in its own static <code>js</code> file, assigned to a variable, that gets loaded with the page and (hopefully) cached on subsequent visits?</p></li>
  <li><p>Should it be sent over (at least initially) as JSON via Ajax - would that give me the same caching benefits (except with a bit more flexibility)?</p></li>
  <li><p>What about local storage - is it recommended? Does it work in IE8? How would I make use of it in this case if so? Can I invalidate it if I have to?</p></li>
  </ul>
  
  <p>Like I said, the client-side is being built in React, but I'm also using jQuery if that's relevant.</p>
  
  <p>Any help or suggestions appreciated, thanks.</p>