Подскажите что делать

[Odrin]

Добрый день.

На сайтах, над которыми я работаю, мне часто необходимо отображать большие списки чего- либо. И каждый раз я сталкиваюсь с одной и той же проблемой, при добавлении большого кол- ва DOM элементов на страницу создается заметная задержка в отрисовке этих элементов- несколько сотен div'ов (в каждом еще n дочерних) создают задержку в 2-3 сек. (а наш с вами любимый браузер может вообще зависнуть). Кроме того браузер начинает тормозить при работе с такими большими списками.

Возьмем, например, предприятия. Я делаю AJAX запрос на сервер и получаю от него список этих предприятий (200-300 шт.), на клиенте генерю html и вставляю в страницу с помощью $(xxx).append(); Естественно, вставляю не по одному, а сначала создаю большой html кусок и вставляю его.

Думал, как решить эту проблему. Пришла в голову такая идея- т.к. одновременно на странице видно только ~10 предприятий, а остальные скрыты скроллом, может и не вставлять их в страницу? Т.е. отрисовывать 10 сверху, 10 видимых, 10 снизу, а остальное место заполнять div'ом нужной высоты (чтоб скролл- бар был) и все это перерисовывать, когда продвигается скролл.

Вот и подумал, а не написать ли мне плагин к jQuery. Но поскольку изобретать велосипед не хочется, хочу сначала спросить у Вас, нет ли уже чего- нибудь подобного? (гугление результатов не дало)

Или может предложите другой способ заставить это все работать быстро?

Заранее благодарен =)

[Great Rash]

Самый простой выход - отказаться от .append() в пользу .html(). innerHTML работает намного быстрее, по-идее, чем вставка в DOM циклом. Соберите в том же цикле строку кода и вставьте её.

[Odrin]

Так я же и говорю, нету вставки циклом,

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

[Great Rash]

Читайте внимательно! Не .append(), а .html(). Вставлять надо не DOM-элементы, а HTML-строку.

[freeneutron]

У меня тоже были большие тормоза до тех пор, пока комп не умер от старости. Потом я купил новый и тормоза пропали