Много блоков и вопрос производительности

карусель
200+ блоков

УПРЛС.

Там у всех, кроме видимых, display: none.

Следовательно возникает потребность делать что-то типа:

var $prev = carousel.children(':visible:first-child').prev()

А можно сделать так:

var e = _.findWhere(carousel, {'visible': true})
var index = carousel.indexOf(e)
var $prev = carousel[index-1].$el

Кода вроде бы и больше (это есть не сжимать), но оно по DOM'у из двухсот элементов не лазит, а всего лишь по массиву.

Ок. А как делать, если заказчик хочет что бы на одной странице было 4 карусели-листалки товаров с динамической подгрузкой?

Да не, я не о том. А зачем это нужно пользователю? Кто-то всерьёз будет просматривать 200 штук? А если захочет найти когда-то просмотренную будет клацать до посинения? Юзабилити плохое.

А вообще, у тебя что-то уже тормозит или ты так, гипотетически? Потому что если нет, то забей. Если да, то скорости, бывает, можно достичь отказавшись от использования фреймворка в той части, где у тебя 100500 итераций, например.

Ну или, к примеру, не делать find_что_нибудь каждый раз, когда нужно что-то сделать, а сохранять как-нибудь.

А чем отличается 4 карусели от одной? Та же петрушка, только на 4 разных элементах :)

Кто-то всерьёз будет просматривать 200 штук?

Ну мне стоит это учесть что такие могут быть.

А вообще, у тебя что-то уже тормозит или ты так, гипотетически?

Ну пока что проектирую.

Ну или, к примеру, не делать find_что_нибудь каждый раз, когда нужно что-то сделать, а сохранять как-нибудь.

Так об этом и речь. Я хочу вместо обращений в dom, все при добавлении «закешировать» в массив. И в нем уже делать find_что_нибудь.

А чем отличается 4 карусели от одной? Та же петрушка, только на 4 разных элементах :)

Ну одно должно быть слайдшоу на всю страницу. Другое — листалка на весь экран с первьюшками внизу (тоже листалка). И ещё есть. И это должно без перезагрузки переключаться. А ещё должно свистеть и пердеть.

Ну мне стоит это учесть что такие могут быть.

Обычно этого просто не допускают.

Так об этом и речь. Я хочу вместо обращений в dom, все при добавлении «закешировать» в массив. И в нем уже делать find_что_нибудь.

Если у тебя все элементы уже в DOM, а слайдер такой огромный, то, скорее всего, переходов по прямому номеру там не будет -> достаточно кнопок вперёд и назад -> не нужно ничего искать, достаточно менять координаты видимой части «полоски».

Если элементы не в DOM -> всё равно придётся кэшировать какое-то количество, чтобы при переходе назад у пользователя не было повторных запросов в сеть.

Вариант «выпороть», я так понимаю, не подходит? (^ ^)'

Слайдшоу на всю страницу работают отдельно от остальных, значит ничем не помешает. Просто останавливай остальные обычные карусели, если они у тебя автоматически переключаются (и вообще существуют).

достаточно менять координаты видимо части «полоски».

Обычно это делается так:

<div style="position:relative">
    <ul style="position:absolute;left:-1000px">
        <li>Item</li>
        ...
    </ul>
</div>

<ul style="position:relative;">
    <li style="display:none">Invisible item</li>
    <li style="position:absolute;left:0">First visible</li>
    ...
</ul>

Просто останавливай остальные обычные карусели, если они у тебя автоматически переключаются (и вообще существуют).

Это само собой. Они останавливаются и прячутся.
Вопрос в том, как сделать что бы одна конкретная карусель нормально работала с кучей элементов.

Или я пробую экономить на спичках.

Не знаю как там оно реально в браузерах (не было таких извращений), но экономия несколько сомнительная мне показалась (^ ^)

Некоторые, вон, вообще не парятся. Делают «бесконечные страницы» на страницах с превьюшками картинок… (^ ^)'

Там у всех, кроме видимых, display: none.

Не поможет. Браузер картинки все равно будет грузить.

Это меня не смущает. Мне все равно для того, что бы узнать размер слайда, сначала надо прогрузить картинки.

Прячу я блоки для того, что бы браузеру не надо было совать все овер1000 блоков, когда анимация перелистывания работает. Соответственно двигаю только те, что надо.

Уже сделал, кстати.

На деле добавить внутрь этого всего массив оказалось проще, чем дергать все элементы из DOM'а через jQuery.

Тогда в чем вопрос? Смотрите как в твиттербутстрапе сделано. Там проверено миллионами мух, они не ошибаются.