jQuery: увеличьте восприимчивость во время события Ready

Question

• Запуск кода на готовом документе - это столп jQuery.
• Но иногда длительные операции будут выполняться внутри события ready.
  • Например, для присоединения нескольких каруселей к длинным неупорядоченным спискам потребуется некоторое время.

Вопрос:

Как я могу увеличить воспринимаемую отзывчивость во время готового события?

Например:

• Могу ли я получить экземпляр thickbox с надписью "Знаете ли вы?" раздел, который скрывает основные манипуляции DOM?
  • ... А затем автоматически закрывать этот экземпляр Thickbox, когда событие готовности завершится?

Answer 1

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

[править]

Примерно так:

$(function() {
    tb_show(caption, url, imageGroup); // show thickbox

    /* lengthy operation here */

    tb_remove(); // remove thickbox
});

[/ править]

Answer 2

В дополнение к индикаторам хода выполнения вы можете распараллеливать несколько операций с помощью функции Javascript setTimeout с очень коротким тайм-аутом. Это эффективно позволяет вам использовать несколько потоков в браузере, выполняя каждую операцию асинхронно.

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

Обратите внимание, что минимальное время ожидания в браузерах обычно составляет 10-20 мс, но оно варьируется в зависимости от браузера; оно должно быть достаточно коротким, чтобы быть незаметным. Если вы установите тайм-аут 0, он по умолчанию будет минимальным для браузера.

Вот простой пример настройки карусели, разделив списки на две группы:

setTimeout(function () {
    // code for attaching first carousel group
    // ...
}, 0);
setTimeout(function () {
    // code for attaching second carousel group
    // ...
}, 0);