2012-05-28 3 views
2

У вас есть опыт работы со следующей проблемой: JavaScript должен запускать сотни вызовов с интенсивной эксплуатацией, которые невозможно пропустить, и заставить браузер чувствовать себя разбитым на несколько секунд (например, без прокрутки и щелчок)? Пример. Представьте 500 вызовов для получения высоты элементов, а затем выполните сотни модификаций DOM, например. классы настройки и т. д. К сожалению, нет возможности избежать задач, требующих высокой производительности. Веб-работники могут быть подходом, но они не очень хорошо поддерживаются (IE ...). Я думаю о тайм-ауте или обратном вызове, основанном шаг за шагом, предоставляя браузеру время для чего-то промежуточного. У вас есть опыт, который вы можете поделиться с этим?Выполнение JavaScript «в фоновом режиме»

С наилучшими пожеланиями

ответ

0

Вот что я могу порекомендовать в этом случае:

  1. Проверка кода снова. Попробуйте применить некоторые стандартные оптимизации, как предложено, например. уменьшая поиск, делая изменения DOM в автономном режиме (например, с document.createDocumentFragment() ...). Работа с фрагментами DOM работает только ограниченным образом. Извлечение высоты элемента и выполнение сложного формования не будет достаточным.
  2. Если 1. не решит проблему, создайте решение рендеринга, выполняющееся по требованию, например. вызванное событием прокрутки. Или: визуализируйте шаг за шагом с помощью тайм-аутов, чтобы дать браузеру время сделать что-то среднее между ними, например. нажатие кнопки или прокрутка.

Краткий пример шаг за шагом рендеринга в 2 .:

var elt = $(...); 
function timeConsumingRendering() { 

    // some rendering here related to the element "elt" 

    elt = elt.next(); 
    window.setTimeout((function(elt){ 
     return timeConsumingRendering; 
    })(elt)); 
} 
// start 
timeConsumingRendering(); 
2

Посмотрите на эту тему, это некоторые вещи, связанные с вашим вопросом.

How to improve the performance of your java script in your page?

+0

Ну, это может быть очень хорошим решением для общих проблем, связанных с оказанием. В моем случае, я думаю, это может быть не полностью решить проблему. Вот почему я ищу «шаг за шагом рендеринг в фоновом режиме». Большинство отображаемых элементов будут видны после прокрутки. – Bernd

1

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

Что требует времени, это не так много вычислений и функций и т. Д., Но сама манипуляция с DOM и выполнение этого только один раз или пару раз в разделах значительно улучшит скорость вашего действия.

Насколько я знаю, веб-рабочие на самом деле не предназначены для манипуляций с DOM, и я не думаю, что при использовании их будет много преимуществ, поскольку проблема, вероятно, заключается в том, что вы меняете shitload of элементов один за другим вместо того, чтобы заменять их все в DOM в одной партии.

+0

В моем случае это фактически метод jQuery.height(), потребляющий около 70% времени. В другой раз DOM-манипуляции ... Выполнение всех автономных фрагментов не полностью решает проблему. Вот почему я ищу решение «шаг за шагом». – Bernd

Смежные вопросы