Рендеринг 20 больших одинаковых списков - PullRequest
0 голосов
/ 05 января 2010

У меня есть HTML-таблица со строками (20 строк). Каждая строка имеет список стран (около 250 стран), которые заполняются с использованием одного набора данных из базы данных.

Время загрузки достаточно быстрое, но время рендеринга действительно беспорядок. Есть ли способ ускорить рендеринг этих списков?

Ответы [ 2 ]

1 голос
/ 05 января 2010

Вы можете попытаться добавить следующее поле выбора только после того, как пользователь выбрал предыдущее (с помощью JavaScript).

Я совершенно уверен, что вы можете переосмыслить форму или процесс, но я не могу предложить что-то конкретное, поскольку вы не предоставили достаточно информации. Например, в зависимости от ситуации вы можете использовать множественный выбор или какой-нибудь причудливый виджет JavaScript.

РЕДАКТИРОВАТЬ на основе вашего комментария:

Тогда как насчет сервировки стола без выбора? И если пользователь дважды щелкает по полю страны, вы изменяете текстовый элемент, чтобы выбрать элемент, используя JavaScript. И как только пользователь выбрал страну, вы можете вернуться обратно к текстовому элементу. Вы можете отправить результаты обратно на сервер, используя Ajax (после того, как пользователь выбрал страну) или используя скрытые поля, кнопку отправки. Таким образом, DOM никогда не будет содержать более 1 выбранного элемента.

Вы можете передавать страны в javascript, используя встроенный объект / массив JSON (в тегах скрипта). Чтобы сделать вещи еще быстрее после того, как пользователь отредактировал первый элемент, просто спрячьте (css: display: none;) первый элемент выбора сборки и клонируйте / перемещайте его каждый раз, когда пользователь хочет отредактировать строку.

Как вы можете видеть, есть много путей, которые вы можете использовать, используя этот подход, все зависит от того, насколько вы хотите оптимизировать / работать над ним.

1 голос
/ 05 января 2010

Вы можете загрузить его только один раз, а затем скопировать элемент DOM везде, где вам это нужно ...

Я не уверен, что это значительно улучшится, так как это будет зависеть больше от компьютера пользователя, но я думаю, стоит попробовать, если это будет слишком медленно, как сейчас.

edit: вот как я это сделаю. Используйте с осторожностью, я не проверял его, и, скорее всего, в этом коде есть множество ошибок, просто чтобы вы поняли, о чем я говорил.

<mylistbox id="listboxtemplate"> ... </>

<div class="thisPlaceNeedsAListbox"></div>
<div class="thisPlaceNeedsAListbox"></div>
<div class="thisPlaceNeedsAListbox"></div>

на документе готово, используя jquery:

jQuery(".thisPlaceNeedsAListbox").append( jQuery("#listboxtemplate").clone() )
...