Производительность HTML <datalist> со многими входами и строками списка?

У меня есть таблица с ~500 строк, которая состоит из 3 столбцов: Name | autocomplete <input> | button,

<table>
  <tr>
    <td>Bob</td>
    <td><input/></td> <!-- todo - add autocomplete -->
    <td><button> click me </button></td>
  </tr>
  <tr>
    <td>Charles</td>
    <td><input/></td> <!-- todo - add autocomplete -->
    <td><button> click me </button></td>
  </tr>
  <tr>
    <td>Will</td>
    <td><input/></td> <!-- todo - add autocomplete -->
    <td><button> click me </button></td>    
  </tr> 
  <!-- more rows (not shown) ... --> 
</table>

Я работаю, чтобы иметь <input> быть автозаполненным даталистом.

Тем не менее, вклад в мой datalist состоит из ~1000 записей. В результате я спорю между:

  1. предварительно заполнить каждый input с ~1000 записей в каждом input "s datalist
  2. запускать AJAX-запрос, когда пользователь вводит input чье 'onComplete' будет заполнять input "s datalist с результатами
  3. ??? (еще один вариант, о котором я не думал)

Целесообразно ли реализовать вариант 1, т.е. создать ~500 (каждая строка) <input> с 1000 (размер списка) datalist опции? Или это остановит загрузку страницы?

0 ответов

Другие вопросы по тегам