Как запустить длинный сценарий js, который нуждается в доступе к DOM в браузере? [Дубликат]

Вы можете попробовать выполнить длительные вычисления в потоках (см. JavaScript и Threads ), хотя они не очень переносимы.

Вы также можете попробовать использовать некоторый Javascript-профайлер для найти узкие места производительности. Firebug поддерживает профилирование javascript.

Мой опыт заключается в том, что манипуляция DOM, особенно в IE, является гораздо более важной задачей для производительности, чем «основной» JavaScript (цикл и т. д.).

Если вы строите узлы, быстрее в IE, создавая строку HTML, а затем устанавливая innerHTML в контейнере, чем используя методы DOM, такие как createElement / appendChild.

Это все еще немного кровоточит, но Firefox 3.5 имеет такие вещи, которые называются Web Workers, но я не уверен в их поддержке в других браузерах.

Mr. У Resig есть статья о них здесь: http://ejohn.org/blog/web-workers/

И симулированный отжиг , вероятно, является Простейший пример этого, если вы заметите, что вращающийся логотип Firefox не замерзает, когда рабочие потоки выполняют свои запросы (таким образом, не замораживая браузер).

Вы можете попытаться сократить код с помощью

 $(xmlDoc).find("Object").each(function(arg1) {
    (function(arg1_received) {
                setTimeout(function(arg1_received_reached) {

                    //your stuff with the arg1_received_reached goes here 

                }(arg1_received), 0)
            })(arg1)
}(this));

или для циклов «для» try

for (var i = 0 ; i < 10000 ; i = i + 1) {
    (function(arg1_received) {
        setTimeout(function(arg1_received_reached) {

            //your stuff with the arg1_received_reached goes here 

        }(arg1_received), 0)
    })(arg1_to_send)
}

У меня была та же проблема, и мои клиенты сообщали об этом как " Убить страницу ". Но теперь я получил лучшее решение для этого. :) [/ Д2]

Использовать таймауты.

Поместив содержимое вашего цикла (ов) в отдельные функции и вызывая их из setTimeout () с тайм-аутом 50 или около того, javascript даст управление потоком и вернемся через некоторое время, позволяя пользовательскому интерфейсу получить внешний вид.

Здесь есть хорошая работа .

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

• Обновить DOM как нечасто, насколько это возможно. Внесите свои изменения в объекты DOM в памяти и добавьте их только один раз в DOM.
• Используйте innerHTML. Это быстрее, чем методы DOM в большинстве браузеров.
• Используйте делегирование событий вместо обычной обработки событий.
• Знайте, какие вызовы стоят дорого и избегайте их. Например, в jQuery значение $ ("div.className") будет дороже $ ("# someId").

Затем некоторые из них связаны с самим JavaScript:

• Петля как можно меньше. Если у вас есть одна функция, которая собирает узлы DOM, а другая - обрабатывает их, вы выполняете цикл дважды. Вместо этого передайте анонимную функцию функции, которая собирает узлы и обрабатывает узлы по мере их сбора.
• По возможности используйте встроенную функцию. Например, для всех итераторов.
• Используйте setTimeout, чтобы позволить браузеру дышать раз в то время.
• Для дорогостоящих функций, которые имеют идемпотентные выходы, кешируйте результаты, чтобы у вас не было чтобы перекомпилировать его.

В моем блоге есть еще кое-что (ссылка выше).